Question

我有这个代码，当长度为0时，不允许用户输入除a-z A-Z 0-9之外的任何内容。我想提醒用户他不允许输入特殊字符。问题是当我击中太空时，警报出现并在几分之一秒内消失。我的代码出了什么问题？

    $('#value').bind('keypress', function(e) {
        if($('#value').val().length == 0){
            if (e.which == 32){//space bar
                e.preventDefault();
            }
            if (e.which < 48 || 
                    (e.which > 57 && e.which < 65) || 
                    (e.which > 90 && e.which < 97) ||
                    e.which > 122) {
                    e.preventDefault();
                        alert("Not allowed");
            }
        }
    });   

    <input type="text" id="value" />

演示here

Answer 1

很少有建议：

使用on方法代替bind方法
当你在方法回调中时，你可以引用带有“this”关键字的元素

除了这里的建议是代码和小提琴。

$('#value').on('keypress', function(e) {
            if($(this).val().length == 0){
                if (e.which == 32){//space bar
                    e.preventDefault();
                    alert("just some text");
                }
                var valid = (e.which >= 48 && e.which <= 57) || (e.which >= 65 && e.which <= 90) || (e.which >= 97 && e.which <= 122);
if (!valid) {
    e.preventDefault();
}
            }
        });

http://jsfiddle.net/fwcfq/45/

Answer 2

根据对问题和答案的评论，您可能想要考虑向用户显示警报的不同方式。您可以使用jQuery在页面上显示/隐藏提醒用户的元素。例如：

<强> HTML

<input type="text" id="value" />
<p id="alert" style="display:none">Not allowed!</p>

<强>的JavaScript

$('#value').bind('keypress', function (e) {
    var showAlert = false;
    if ($('#value').val().length == 0) {
        if (e.which == 32) { //space bar
            e.preventDefault();
            showAlert = true;
        }
        var valid = (e.which >= 48 && e.which <= 57)
                    || (e.which >= 65 && e.which <= 90)
                    || (e.which >= 97 && e.which <= 122);
        if (!valid) {
            e.preventDefault();
            showAlert = true;
        }
    }
    if (showAlert) {
        $('#alert').show();
    } else {
        $('#alert').hide();
    }
});

您可以在此处查看演示：http://jsfiddle.net/fwcfq/47/

Answer 3

这是你的代码，没关系

$('#value').on('keypress', function(e) {
    if (e.which == 32){//space bar
        e.preventDefault();
    }
    var valid = (e.which >= 48 && e.which <= 57) || (e.which >= 65 && e.which <= 90) || (e.which >= 97 && e.which <= 122);
    if (!valid) {
        e.preventDefault();
        alert("Not allowed");
    }
});

我删除了这个测试

if($('#value').val().length == 0)

jQuery按键事件无法使用警报

3 个答案: