防止向 html 文本字段输入特殊字符答案

【问题标题】：Preventing special character input to html text field防止向 html 文本字段输入特殊字符
【发布时间】：2010-08-23 22:50:19
【问题描述】：

我有一个输入文本字段，需要限制可以输入的字符。作为一种防御错误输入的形式，我什至不让用户输入错误的内容。输入可以是 [a-zA-Z-._] 字符，并且限制为 32 个字符。

<input id="aliasEntry" type="text" maxlength="32">

如您所见，我已经确定了 32 个字符的限制，并且在达到限制后禁止用户再输入。但是我在防止输入不正确的字符方面遇到了问题。

我尝试使用 jquery 的 .keypress() 和 .keydown() 事件捕获器来执行类似于以下的操作：

$("#aliasEntry").keypress(function(e)
{
    var code = e.which || e.keyCode;
    // 65 - 90 for A-Z and 97 - 122 for a-z 95 for _ 45 for - 46 for .
    if (!((code >= 65 && code <= 90) || (code >= 97 && code <= 122) || code == 95 || code == 46 || code == 45))
    {
        var text = $("#aliasEntry").val();
        text = text.substring(0,text.length);
        $("#aliasEntry").val(text);
    }
});

但是这样做的问题是浏览器总是在事件处理后将键入的字符插入文本框中，这使得代码无用，因为我试图消除的字符尚未输入。有没有办法简单地阻止浏览器在用户键入字符后将字符插入文本框中？

【问题讨论】：

记得也要进行服务器端验证。客户端验证真的很容易被骗（在这种情况下关闭浏览器上的 JavaScript）
使用 jQuery 时，您不必再次规范化 e.which。
请记住，最好有一些 UI 来解释为什么用户的键盘突然停止工作。

标签： javascript html validation

【解决方案1】：

您正在使用 jQuery，请参阅：http://api.jquery.com/event.preventDefault/。如果字符恰好无效，只需调用e.preventDefault()，这应该可以防止发生默认的浏览器操作，在这种情况下是插入字符。

【讨论】：

并在keypress期间进行；在 Opera 中，您无法阻止 keydown 期间的默认操作。
是的，效果很好。我也在朝那个方向寻找，以确定是否可以简单地停止事件，但我搞砸了错误的方法。谢谢！

【解决方案2】：

像这样使用你的输入

<input maxlength="32" onKeyUp="chText()" onKeyDown="chText()" id="aliasEntry"/>

并在其中写入 chText() javascript 函数下面这段代码

function chText()
{
    var str=document.getElementById("aliasEntry");
    var regex=/[^a-z]/gi;
    str.value=str.value.replace(regex ,"");
}

除了a-z 和A-Z 之外，它不允许任何字符输入

【讨论】：