php设置input时间格式,Javascript控制input输入时间格式的方法_javascript技巧

本文实例讲述了Javascript控制input输入时间格式的方法。分享给大家供大家参考。具体分析如下：

之前做了一个Javascript控制时间格式的输入，主要用到了keydown和keyup两个事件，但感觉写的很复杂而且还有bug。

今日了解了一下keypress事件与keydown和keyup的区别。大致如下(目前只了解这么多)：

keydown：按键按下的时候触发，通过event可以获取到keyCode，可以获取到文本框输入之前的值；

keyup：按键弹出(松开)时触发，通过event可以获取到keyCode，可以获取到文本框输入之后的值；

keypress：此事件在Chrome和IE中基本相同，但Firefox有点不一样；

1、在Chrome和IE中：只要按下的键能在文本框中出现字符则会触发(如输入字母、数字、符号等)，通过event可以获取到keyCode，event.key为undefined；不能出现字符的则不会触发(如方向键、Home、Backspace等)

2、在火狐中：字母、数字、符号、方向、退格等按键均能触发，均可以通过event.key获取按键名，如果所按的键能输出字符则event.keyCode为0，如果不能输出字符则event.keyCode为对应的ASCII码

回到正题，先直接看代码(上面提到的event就相当于下面代码中的e)：

var isFF = /firefox/i.test(navigator.userAgent);

$("input").on({

keyup : function (e) {

!/^[\d:]+$/.test(e.target.value) && (e.target.value = "");

},

keypress : function (e) {

if (isFF && e.keyCode !== 0) {

/// 在火狐中按任意键都会触发keypress事件，而在IE/Chrome中只有按下能输出字符的按键才会触发

/// 针对火狐，e.keyCode!==0则按下了退格、方向、Home等按键之一

} else {

if (e.target.value.length > 7)

return false;

if (/\d{2}$/.test(e.target.value)) {

e.target.value += ':';

}

var char = String.fromCharCode(e.keyCode === 0 ? e.which : e.keyCode);

if (!/^\d/.test(char))

return false;

}

}

});

通过isFF && e.keyCode !== 0来区分Firefox能输出字符的按键和不能输出字符的按键，由于Firefox中e.keyCode不一定能取到值，所以使用了e.which来取代。

keyup是用于处理使用输入法时能输入中文或字母的问题。

通过String.fromCharCode()得到ASCII码对应的字符。

希望本文所述对大家的javascript程序设计有所帮助。

本文原创发布php中文网，转载请注明出处，感谢您的尊重！