javascript - Jquery 允许字母数字字符和非文本按键

Question

我有一个文本框，用户只能在其中输入字母数字字符，并且应该允许按非文本键，如退格键、箭头键等。此外，它还应该适用于所有主流浏览器(如 Mozilla Firefox)。

我尝试了几个示例，这些示例只允许我输入字母数字字符，但退格键不适用于 Mozilla Firefox 中的以下示例。

$('input').bind('keypress', function (event) {
    var regex = new RegExp("^[a-zA-Z0-9]+$");
    var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
    if (!regex.test(key)) {
       event.preventDefault();
       return false;
    }
});

Answer 1

您可以添加 [\b] 以匹配并允许退格。

代码:

var regex = new RegExp("^[a-zA-Z0-9\b]+$");

演示:http://jsfiddle.net/M3bvN/

更新

您可以检查按下的键是否在允许键列表(arrows、home、del、canc)中，如果是，则跳过验证，而不是扩展您的正则表达式。

这不会阻止用户复制/粘贴不允许的字符。所以也在 blur 事件中执行验证控制(并且总是在服务器端)。

代码:

var keyCode = event.keyCode || event.which
// Don't validate the input if below arrow, delete and backspace keys were pressed 
if (keyCode == 8 || (keyCode >= 35 && keyCode <= 40)) { // Left / Up / Right / Down Arrow, Backspace, Delete keys
    return;
}

演示:http://jsfiddle.net/M3bvN/3/