本文实例讲述了javascript限制文本框输入值类型的方法。分享给大家供大家参考。具体分析如下：
要求：所有的文本框，只能输入数字和小数点，其他的符号一概不能输入；
重点是我希望在用户输入时就做限制，而不是提交时判断——也就是说如果用户在文本框内输入数字或小数点，可以正常输入；如果输入字母等非数字字符，则文本框会没有任何反应，不会显示输入的字符。
<html>
<body>
[removed]
var s = "<input type=\"text\" size=\"20\" " +
"style=\"text-align:center\" " +
"onkeydown=\"if(event
在JavaScript中，限制文本框（`<input type="text">`）输入值的类型是一项常见的需求，特别是当需要用户输入特定格式的数据时，如数字、日期等。在本例中，我们将探讨如何通过JavaScript实现一个功能，使得文本框只允许用户输入数字和小数点，而阻止其他任何字符的输入，包括字母和其他特殊符号。
我们需要理解HTML中的`<input>`标签，它是用于创建交互式表单元素的。`type="text"`属性定义了一个单行文本输入字段。在这个例子中，我们还添加了`size="20"`来定义输入框的宽度，并通过`style="text-align:center"`使文本居中对齐。
为了限制输入的类型，我们将使用JavaScript的事件处理函数。事件处理函数是在特定事件（如用户按下键盘上的键或离开输入字段）发生时调用的函数。在这个示例中，我们关注的是`onkeydown`、`onblur`和`onbeforepaste`这三个事件：
1. `onkeydown`事件：当用户按下键盘上的键时触发。我们使用`event.keyCode`来检查用户按下的键对应的ASCII码。数字键的ASCII码范围是48到57（包含），小数点（`.`）的ASCII码是190。因此，我们编写条件`if(event.keyCode>57&&event.keyCode!=190)`来阻止所有非数字和非小数点的键按下。
2. `onblur`事件：当用户离开输入字段时触发。这个事件用来清理可能已经输入但未被`onkeydown`阻止的非法字符。我们使用正则表达式`/[^0-9\.]/g`来匹配并替换掉所有非数字和非小数点的字符。
3. `onbeforepaste`事件：在用户尝试粘贴文本到输入框之前触发。这个事件确保粘贴的文本也符合我们的输入规则。我们获取剪贴板数据，应用相同的正则表达式进行替换，然后再设置回去。
完整的JavaScript代码如下：
```html
<html>
<body>
<script>
var s = "<input type=\"text\" size=\"20\" style=\"text-align:center\" onkeydown=\"if(event.keyCode>57&&event.keyCode!=190) return false\" onblur=\"value=value.replace(/[^0-9\.]/g,'')\" onbeforepaste=\"clipboardData.setData('text',clipboardData.getData('text').replace(/[^0-9\.]/g,''))\">";
document.write(s);
</script>
</body>
</html>
```
这段代码将创建一个符合要求的输入框，即用户只能输入数字和小数点，其他任何字符都将被阻止。这样的功能对于需要用户输入精确数值的场景非常有用，例如填写价格、数量等。
请注意，虽然这种方法可以有效地防止大部分非预期输入，但它并不完全防错。例如，用户可以通过浏览器的开发者工具或其他手段绕过这些限制。为了提供更全面的输入验证，你还需要在服务器端进行验证，确保数据安全。同时，现代Web开发中，推荐使用更高级的事件监听方式（如`addEventListener`）以及框架提供的数据绑定和验证机制，以获得更好的可维护性和兼容性。
