Question

我想让这个功能在文本框失去焦点后检查电子邮件文本框，而不是在用户开始输入后立即检查。所以它只会在.emailError文本框类的文本框中发生错误后引导它们。

我真的不希望它在第一次尝试之后开始显示错误类。只有在输入正确时才显示绿色。

var c = 0;
c = parseInt("c");

$('.emailError').on('focusout', function() {
    c = 1;
});

if (c == 1) { 
    $('.emailError').on('keyup focusout', function() {
        var regex = /^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
        var containsNonEmail = this.value.match(regex);
        console.log(containsNonEmail);

        if (!containsNonEmail) {
            $(".wirelessEmail").css("border", "2px solid #ffeef6");
            $(".wirelessEmail").css("background-color", "#ffecf2");
        } else {
            $(".wirelessEmail").css("border", "2px solid green");
            $(".wirelessEmail").css("background-color", "#f5fef2");
        } 
    });
}

Answer 1

使用 Onblur 功能

当对象失去焦点时会发生onblur事件。

onblur事件通常与表单验证代码一起使用（例如，当用户离开表单字段时）。

Answer 2

您需要在函数内部进行if else检查，而不是在外部。当它在外面时，你不会绑定事件。

更好的方法是进行检查，这样你就不会依赖全局变量，这样你就可以在页面上多次使用它。为此，请使用数据属性。

objectID

$('.emailError').on('keyup focusout', function(evt) {
    var tb = $(this);
    var once = tb.data("once");
    if(evt.type==="focusout" || once) { 
         if (!once) tb.data("once", "true");
         var isError = tb.val().length<5;
         tb.toggleClass("error", isError);
    }

})

.error { background-color : red; }

试图防止此功能被触发直到文本框为＃34; focusout＆＃34;或更好的东西

2 个答案: