HTML文本输入只允许数字输入 [英] HTML text input allows only numeric input
问题描述
是否有一种快速设置HTML文本输入（< input type = text /> ）的方法，只允许数字键击（加'。'）？
虽然这很简单，但它不会让您使用组合键和其他不可键入的键。对于支持输入数字类型和最大长度验证的完整JavaScript解决方案，请考虑使用此Polyfill 。
HTML 5
with <！DOCTYPE html> 原生解决方案：
< input type =number>
注意它在某些浏览器中的行为不是标准方式。
尝试使用输入类型=数字查看HTML5版本。
另请参阅 https：// github.com/jonstipe/number-polyfill 以获得对旧版本的透明支持浏览器。
jQuery
$ （document）.ready（function（）{
$（＃txtboxToFilter）。keydown（function（e）{
//允许：退格，删除，制表符，转义，输入和。
if（$ .inArray（e.keyCode，[46，8，9，27，13，110，190]）！== -1 ||
//允许：Ctrl / cmd + A
（e.keyCode == 65&&（e.ctrlKey === true || e.metaKey === true））||
//允许：Ctrl / cmd + C
（e.keyCode == 67&&（e.ctrlKey === true || e.metaKey === true））||
//允许：Ctrl / cmd + X
（e.keyCode == 88&&（e.ctrlKey === true || e.metaKey === true））||
// Allow：home，end，left，right
（e.keyCode> = 35& e.keyCode< = 39））{
//让它发生，不要做任何事
return; （e.shiftKey ||（e.keyCode< 48 || e.keyCode> 57））确保它是一个数字并停止按键
。 &&（e.keyCode< 96 || e.keyCode> 105））{
e.preventDefault（）;
}
}）;
}）;
更复杂的验证选项
如果你想做一些其他的验证位和片段，这可能是很方便的：
http://www.javascript-coder.com/html-form/javascript-form-validation.phtml
https://github.com/lockevn/html-numeric-input
但是请不要忘记您还必须做服务器端验证！
$ AZERTY键盘的b $ b
：
jQuery p
$ b
//允许：退格，删除，标签，转义，输入和。
if（$ .inArray（e.keyCode，[46，8，9，27，13，110，190]）！== -1 ||
//允许：Ctrl + A
（e.keyCode == 65&&（e.ctrlKey === true || e.metaKey === true））||
//允许：Ctrl + C
（ e.keyCode == 67&&（e.ctrlKey === true || e.metaKey === true））||
//允许：Ctrl + X
（e.keyCode == 88&&（e.ctrlKey === true || e.metaKey === true））||
// Allow：home，end，left，right
（e。 keyCode> = 35& e.keyCode< = 39）||
//允许数字和数字+移位键
（（e.shiftKey&&（e.keyCode> ; = 48& e.keyCode< = 57））||（e.keyCode> = 96& e.keyCode< = 105）））{
//让它发生，不要做任何事情
return; （（！！e.shiftKey&&（e.keyCode< 48 || e.keyCode> $）}确保它是一个数字并停止按键
。 57））||（e.keyCode< 96 || e.keyCode> 105））{
e.preventDefault（）;
}
Is there a quick way to set an HTML text input (<input type=text />) to only allow numeric keystrokes (plus '.')?
JavaScript (the most reliable still)
While this is simple, it will not let you use combination keys and other non-typeable keys. For a complete JavaScript solution that also supports input of type number and max length validation, consider using this Polyfill.
HTML 5
with <!DOCTYPE html> has native solution:
<input type="number">
Beware that it does not behave in a standard way in some browsers.
Try input type=number to see the HTML5 version in action.
See also https://github.com/jonstipe/number-polyfill for transparent support in older browsers.
jQuery
$(document).ready(function() {
$("#txtboxToFilter").keydown(function (e) {
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl/cmd+A
(e.keyCode == 65 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: Ctrl/cmd+C
(e.keyCode == 67 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: Ctrl/cmd+X
(e.keyCode == 88 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: home, end, left, right
(e.keyCode >= 35 && e.keyCode <= 39)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
});
More complex validation options
If you want to do some other validation bits and pieces, this could be handy:
http://www.javascript-coder.com/html-form/javascript-form-validation.phtml https://github.com/lockevn/html-numeric-input
But don't forget you still must do server side validation!
for AZERTY keyboard:
jQuery
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A
(e.keyCode == 65 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: Ctrl+C
(e.keyCode == 67 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: Ctrl+X
(e.keyCode == 88 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: home, end, left, right
(e.keyCode >= 35 && e.keyCode <= 39) ||
//Allow numbers and numbers + shift key
((e.shiftKey && (e.keyCode >= 48 && e.keyCode <= 57)) || (e.keyCode >= 96 && e.keyCode <= 105))) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((!e.shiftKey && (e.keyCode < 48 || e.keyCode > 57)) || (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
这篇关于HTML文本输入只允许数字输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
