Question

在文本框中仅允许字母/数字的最简单方法是什么。我们使用JS / jQuery，但不想使用验证插件？

Answer 1

您可以在表单提交上使用简单的正则表达式来评估文本框的内容，显示错误并停止表单提交。从检查中创建一个函数，您也可以在文本框失去焦点时应用它。经常这样做，你会发现你已经重新实现了验证插件。

$(function() {
    $('form').submit( function() {
        return validateTB( $('#textbox'), true, $('#textboxError') );
    });

    $('#textbox').blur( function() {
        validateTB( $(this), true, $('#textboxError') );
    });

    function validateTB(tb,required,msg) {
        var $tb = $(tb);
        var re = '/^[a-z0-9]';
        if (required) {
           re += '+';
        }
        else {
           re += '*';
        }
        re += '$/';

        if ($tb.val().match(re) == null) {
           $(msg).show();
           return false;
        }
        $(msg).hide();
        return true;
    }
});

Answer 2

我的解决方案是：

jQuery('input[type="text"]').keyup(function() {
    var raw_text =  jQuery(this).val();
    var return_text = raw_text.replace(/[^a-zA-Z0-9 _]/g,'');
    jQuery(this).val(return_text);
});

每次用户尝试输入数字，字母，空格或下划线以外的任何内容时，该函数都会返回一个包含已移除的带状字符的字符串。

Answer 3

如果你不想使用插件 - 那么一些普通的旧JS验证呢？

我刚刚在我的博客上发布了这个 - ＆gt; http://dotnetbutchering.blogspot.com/2009/04/definitive-javascript-validation-with.html

你会看到我提出的解决方案中的函数需要一个输入字段ID和一个正则表达式（你需要为你的验证需求提供一个regEx，如果你只需要aplhanumeric，那么这应该是非常简单的）根据验证结果将控件的背景设置为绿色或红色。我知道它并不完美，但我认为这足以让你前进，你可以用它作为自己的起点。

我确信使用jQuery或普通JS有一些优雅的解决方案，但到目前为止，这些方面的内容对我来说一直很好。

希望它有所帮助。

Answer 4

由于tvanfossen的代码片段仅在提交时触发而且Ian的内容不尽如人意，我只想添加更清晰的方法：

HTML：

<input id="myinput" type="text">

JS（jquery）：

$('#myinput').keypress(function (e) {
    var regex = new RegExp("^[a-zA-Z0-9]+$");
    var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
    if (regex.test(str)) {
        return true;
    }
    e.preventDefault();
    return false;
});

Answer 5

这是一个简单的解决方案，它将检查密钥上的输入并删除用户输入的不需要的字符：

<input class="usr" type="text id="whatever" name="whatever" />

        $(".usr").keyup(function() {
            var n = $(this).val();
            if ( n.match("^[a-zA-Z0-9 ]*$") == null ) {
                $(this).val(n.slice(0,-1));
            }
        });

可以修改正则表达式以适应规范。

Answer 6

Ian答案的变体更轻巧，更短：

function onlyAllowAlphanumeric() {
    this.value = this.value.replace(/[^a-zA-Z0-9 _]/g, '');
});

$('input[type="text"]').keyup(onlyAllowAlphanumeric);

jquery / JS只允许数字＆amp;文本字母中的字母

6 个答案: