Question

目前我在输入字段上使用 keydown 事件来验证30个字符的限制。当用户输入第31个字符时，验证消息出现＆＃34;请输入30个字符＆＃34;。但是当我选择整个文本时，只需双击文本框并按任意字母/数字，然后文本不会删除，它会显示消息＆＃34;请输入30个字符＆＃34; 。我想在用户按字母/数字时删除整个文本。目前我正在使用：

$('#inputBox').live("keydown", function(event) {

    var inputLength = $(this).val().length;
    var boolPassValidation = false;

    if (event.keyCode === 8) {
        boolPassValidation = true;
    }


    if (inputLength >= 30 && !boolPassValidation) {
        alert("Please enter a valid PO number, 30 characters max.");

    }

    return false;
} else return true;
});

任何建议都会有很大的帮助。

Answer 1

<强> jsFiddle demo

取决于您使用的jQuery v，但不推荐使用.live()方法^{（自v.1.7起并从1.9中删除）} - 请改为使用.on()：

$(document).on("input", "#inputBox", function(e) {
    var v = this.value;
    if (v.length > 30 && e.which!==8) {
        alert("Please enter a valid PO number, 30 characters max.");
        this.value = this.dataset.oldVal;
    }else{
        this.dataset.oldVal = v;
    }
});

如果您要搜索的字符串长度为30个字符，则需要使用>30代替>=30，否则您将警告30个字符，这很好。

使用jQuery＆＃39; event.which代替 keyCode 以获得更好的xBrowser兼容性

如果您的#inputBox未动态生成，则只需使用$("#inputBox").on("input", function(e) {，否则请尝试使用静态父#选择器而不是$(document)

_{P.S：您还可以将maxlength=30属性添加到输入元素}

将输入值恢复为上一个有效字符串

1 个答案: