我需要确保某个<input>字段只接受数字作为值。输入不是表单的一部分。因此,它不会被提交,所以在提交过程中验证不是一个选项。我希望用户不能键入除数字以外的任何字符。
有没有一种很好的方法来实现这一点?
发布于 2012-12-19 20:42:25
HTML 5
您可以使用HTML5 input type number仅限制数字条目:
<input type="number" name="someid" />这仅适用于HTML5投诉浏览器。确保您的html文档的doctype为:
<!DOCTYPE html>
另请参阅https://github.com/jonstipe/number-polyfill,以获得旧浏览器中的透明支持。
JavaScript
更新:有一个新的非常简单的解决方案:
它允许您在文本
<input>上使用任何类型的输入筛选器,包括各种数字筛选器。这将正确处理Copy+Paste、Drag+Drop、键盘快捷键、上下文菜单操作、不可键入的键和所有键盘布局。
查看this answer或亲自尝试on JSFiddle。
对于一般用途,您可以进行如下JS验证:
function isNumberKey(evt){
var charCode = (evt.which) ? evt.which : evt.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
<input name="someid" type="number" onkeypress="return isNumberKey(event)"/>如果您希望允许使用小数,请将"if condition“替换为:
if (charCode > 31 && (charCode != 46 &&(charCode < 48 || charCode > 57)))来源:HTML text input allow only numeric input
JSFiddle演示:http://jsfiddle.net/viralpatel/nSjy7/
发布于 2012-12-19 20:45:01
您还可以在html5中使用pattern属性:
<input type="text" name="name" pattern="[0-9]" title="Title" /> 不过,如果您的文档类型不是html,那么我认为您需要使用一些javascript/jquery。
发布于 2018-12-16 22:48:43
快速而简单的代码
<input type="text" onkeypress="return (event.charCode !=8 && event.charCode ==0 || (event.charCode >= 48 && event.charCode <= 57))" />这将只允许使用数字和退格键。
如果您还需要小数部分,请使用以下代码片段
<input type="text" onkeypress="return (event.charCode !=8 && event.charCode ==0 || ( event.charCode == 46 || (event.charCode >= 48 && event.charCode <= 57)))" />https://stackoverflow.com/questions/13952686
复制相似问题