有一个快速的方法来设置HTML文本输入(<input type=text />),只允许数字击键(加上'.')?
当前回答
这里的大多数答案都有使用关键事件的缺点。
许多答案会限制你使用键盘宏进行文本选择、复制+粘贴和更多不必要的行为,其他的似乎依赖于特定的jQuery插件,这是用机关枪杀苍蝇。
这个简单的解决方案似乎最适合我跨平台,不管输入机制(击键,复制+粘贴,右键单击复制+粘贴,语音到文本等)。所有文本选择键盘宏仍然可以工作,它甚至会限制通过脚本设置非数字值的能力。
function forceNumeric(){
var $input = $(this);
$input.val($input.val().replace(/[^\d]+/g,''));
}
$('body').on('propertychange input', 'input[type="number"]', forceNumeric);
其他回答
这里有一个简单的例子,它只允许有一个小数,不能再多了。输入事件使用regex替换基于以下两种模式的文本:
删除任何不是数字或点的东西 删除点的任何第二个实例
<input type="text" oninput="this. "Value = this.value.replace(/[^0-9。.replace) / g,”) (/(\..*?)\..* / g, 1美元);”/>
正如下面有人评论的那样,上面的解决方案不处理前导零。如果你的特定用例要求这些是不允许的,你可以像这样添加到上面的模式:
<input type="text" oninput="this. "Value = this.value.replace(/[^0-9。.replace) / g,”) (/(\..*?)\..* / g, 1美元).replace(/ ^ 0 ^。] /, ' 0 ');“/>
这将允许0.123或。123,但不允许0123或00.123。
您可以尝试使用" 'onkeydown " '事件并取消事件(事件。preventDefault或类似的)当它不是允许的键之一。
input type="number"是一个HTML5属性。
在另一种情况下,这将帮助你:
function isNumberKey(evt){
var charCode = (evt.which) ? evt.which : evt.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
<input type="number" name="somecode" onkeypress="return isNumberKey(event)"/>
我对它做了一些调整,但它需要做更多的工作来符合JavaScript的奇怪方式。
function validateNumber(myEvent,decimal) {
var e = myEvent || window.event;
var key = e.keyCode || e.which;
if (e.shiftKey) {
} else if (e.altKey) {
} else if (e.ctrlKey) {
} else if (key === 48) { // 0
} else if (key === 49) { // 1
} else if (key === 50) { // 2
} else if (key === 51) { // 3
} else if (key === 52) { // 4
} else if (key === 53) { // 5
} else if (key === 54) { // 6
} else if (key === 55) { // 7
} else if (key === 56) { // 8
} else if (key === 57) { // 9
} else if (key === 96) { // Numeric keypad 0
} else if (key === 97) { // Numeric keypad 1
} else if (key === 98) { // Numeric keypad 2
} else if (key === 99) { // Numeric keypad 3
} else if (key === 100) { // Numeric keypad 4
} else if (key === 101) { // Numeric keypad 5
} else if (key === 102) { // Numeric keypad 6
} else if (key === 103) { // Numeric keypad 7
} else if (key === 104) { // Numeric keypad 8
} else if (key === 105) { // Numeric keypad 9
} else if (key === 8) { // Backspace
} else if (key === 9) { // Tab
} else if (key === 13) { // Enter
} else if (key === 35) { // Home
} else if (key === 36) { // End
} else if (key === 37) { // Left Arrow
} else if (key === 39) { // Right Arrow
} else if (key === 190 && decimal) { // decimal
} else if (key === 110 && decimal) { // period on keypad
// } else if (key === 188) { // comma
} else if (key === 109) { // minus
} else if (key === 46) { // Del
} else if (key === 45) { // Ins
} else {
e.returnValue = false;
if (e.preventDefault) e.preventDefault();
}
}
然后它被称为via:
$('input[name=Price]').keydown(function(myEvent) {
validateNumber(myEvent,true);
});
你也可以比较输入值(默认情况下被视为字符串)和它本身被强制为数字,比如:
if(event.target.value == event.target.value * 1) {
// returns true if input value is numeric string
}
然而,你需要绑定到事件,如keyup等。