有没有一种快速的方法来将HTML文本输入(<input type=text />)设置为仅允许数字键击(加’。’)?
<input type=text />
注意: 这是更新的答案。下面的注释指的是一个旧版本,其中充斥着密钥代码。
您可以<input>使用以下setInputFilter功能过滤文本的输入值(支持Copy + Paste,Drag + Drop,键盘快捷键,上下文菜单操作,不可键入的键,插入标记的位置,不同的键盘布局以及IE 9以后的所有浏览器) :
<input>
setInputFilter
// Restricts input for the given textbox to the given inputFilter function. function setInputFilter(textbox, inputFilter) { ["input", "keydown", "keyup", "mousedown", "mouseup", "select", "contextmenu", "drop"].forEach(function(event) { textbox.addEventListener(event, function() { if (inputFilter(this.value)) { this.oldValue = this.value; this.oldSelectionStart = this.selectionStart; this.oldSelectionEnd = this.selectionEnd; } else if (this.hasOwnProperty("oldValue")) { this.value = this.oldValue; this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd); } else { this.value = ""; } }); }); }
现在,您可以使用该setInputFilter功能来安装输入过滤器:
setInputFilter(document.getElementById("myTextBox"), function(value) { return /^\d*\.?\d*$/.test(value); // Allow digits and '.' only, using a RegExp });
另请注意,您仍然必须执行服务器端验证!
还有一个jQuery版本。
HTML 5提供了一个本机解决方案<input type="number">(请参见规范),但是请注意,浏览器支持有所不同:
<input type="number">
step
min
max
e
E