怎么限制input的text里输入的值只能是数字(正则、js)

限制 input 标签的 text 输入只能是数字，可以通过正则表达式和 JavaScript 实现。

方法1：使用正则表达式限制输入

在 html 中 input 标签内使用 pattern 属性来设置正则表达式，如下所示：

<input type="text" pattern="[0-9]*" placeholder="只能输入数字"/>

上述代码中，pattern 属性设置为 [0-9]* ，表示只能输入数字。当用户输入了非数字字符时，回车将无法提交表单，且浏览器会弹出默认的错误提示框。

方法2：使用 JavaScript 限制输入

在 JavaScript 中可以通过正则表达式和事件监听限制 input 标签的内容。

2.1 正则表达式限制

使用正则表达式限制，可以在用户输入时检测其输入的值是否为数字。在 input 标签中，使用 onkeyup 事件来监听input内容的变化，并在事件函数中进行判断。如下所示：

<input type="text" id="num" placeholder="只能输入数字"/>
<script>
document.getElementById("num").onkeyup = function(){
    this.value = this.value.replace(/[^\d]/g, '');
}
</script>

上述代码中，使用 replace() 方法将非数字字符替换为空字符串，达到限制只能输入数字的目的。

2.2 事件监听限制

使用事件监听限制，可以在用户输入时检测其输入的字符是否为数字，并禁止非数字字符的输入。可以使用 onkeypress 事件和 keypress() 函数实现。如下所示：

<input type="text" id="num" placeholder="只能输入数字" />
<script>
document.getElementById("num").onkeypress = function(event) {
    event = event || window.event;
    var keyCode = event.keyCode || event.which;
    if (keyCode < 48 || keyCode > 57) {
        if(event.preventDefault) {
            event.preventDefault();
        }
        else {
            event.returnValue = false;
        }
    }
}
</script>

上述代码中，当用户按下的键的 ASCII 码不在数字 0 到 9 的范围内时，阻止该键的默认行为。

以上是两种限制 input 标签的 text 输入只能是数字的方法。可以根据具体需求，选择其中一种或两种方法相结合。