javascript：在用户键入或更改文本框值时忽略无效输入[重复]

Posted 2023-02-22

【中文标题】javascript：在用户键入或更改文本框值时忽略无效输入[重复]

【英文标题】：javascript: ignoring invalid input as user types or changes text box value [duplicate]

【发布时间】：2012-12-05 13:27:08

【问题描述】：

可能重复：How to allow only numeric (0-9) in html inputbox using jQuery?

当用户在文本框中输入内容时，如何限制用户输入？

例如，我只想接受一个数字，并且只要输入非数字字符，我就想忽略用户输入。 所以，

如果用户输入无效字符，我需要保留现有值 它应该能够处理任何其他输入更改情况（即键入、复制粘贴等）。

谢谢！！！ 罗伯特

【参考方案1】：

您可以使用表单的onsubmit 事件在 javascript 中验证表单：

<form enctype="application/x-www-form-urlencoded" method="post" onsubmit="validate(this);">
    <input type="text" name="number" />
    <input type="submit" name="submit" value="send" />
</form>

那么剩下的就是验证了：

function validate(form) 
    if(isNaN(form.number.value)) 
        alert('not a number!');

        return false;
    

问题是，javascript 在客户端运行。这意味着人们可以轻松绕过这一点，因此您必须以任何一种方式检查服务器端。

如果您确定您的受众使用现代浏览器，您也可以使用 HTML5 元素 <input type="number" />。但话又说回来，这是客户端，您必须检查服务器端。

【参考方案2】：

在文本框上使用 onKeyPress() 事件获取用户输入并根据需要进行相应处理。

要处理复制 + 粘贴场景，您可以通过 onChange() 事件处理来处理。