Question

我有一个文本框，需要验证keyup和blur事件。如果我输入“X”，两个事件都会触发，显然你会看到两个基于下面代码的警报。需要键盘事件，因为我可以基于有效值触发某些操作，并且还需要在按下Tab键的情况下保持模糊事件。目标是在此处显示一个警报。 \ m / \ m /

$("#txtLength").on('keyup blur', function (e) {
    if ($(this).val().length > 0) {
        switch (true) {

            case !$.isNumeric($(this).val()):
                alert("Please enter a numeric value.");
                $(this).focus();
                break

            case ($(this).val() < 5) || ($(this).val() > 10):
                alert("Length must be a numeric value between 5 and 10.");
                $(this).focus();
                break;

            default:
        }
    }
});

Answer 1

感谢您的所有投入。一些好的想法有助于解决问题。坚持主题避免使用.on按键和模糊显示两个警报，这是我最终做的。

var bAlertCalled = false;

$("#txtLength").on('keyup blur', function (e) {
    if (bAlertCalled === true) {
        bAlertCalled = false;
        return;
    }

    if ($(this).val().length > 0) {
        var iLength = parseInt($(this).val());

        switch (true) {
            case !$.isNumeric($(this).val()):
                bAlertCalled = true;
                $(this).focus();
                alert("Please enter a numeric value.");
                break

            case (iLength  < 5) || (iLength  > 10):
                bAlertCalled = true;
                $(this).focus();
                alert("Length must be a numeric value between 5 and 10.");
                break;

            default:
        }
    }
});

Answer 2

如果您使用alert（）或其他一些中断用户的方法，这似乎只会导致问题。使用内联验证的形式，用户可能永远不会注意到。此外，您对值的检查不起作用，因为“6”不是＆gt; 5或者＆lt; 10.我使用parseInt修复了它：

HTML：

<input type="text" id="txtLength" /> <span id='spanLengthValidation'></span>

脚本

$("#txtLength").on('keyup blur', function (e) {
    $("#spanLengthValidation").text("");
    var amt = parseInt($(this).val())
    if ($(this).val().length > 0) {
        switch (true) {
        case !$.isNumeric($(this).val()):
            $("#spanLengthValidation").text("Please enter a numeric value.");
            $(this).focus();
            break;

        case (amt < 5) || (amt > 10):
            $("#spanLengthValidation").text("Length must be a numeric value between 5 and 10.");
            $(this).focus();
            break;

        default:
        }
    }
});

在keyup和blur上使用jQuery文本框验证

2 个答案: