Javascript 使用jquery验证电子邮件后添加类

我正在尝试在表单字段中使用jQuery进行电子邮件验证

$(document).ready(function() {
    var email = new RegExp("[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$");
    var value = $("#email_address").val();

    $("#email_address").on("keypress", function() {
        if(email.test(value)) {
            $("#email_address").parent().addClass("has-success");
        }
    });
});

---

但是，

已成功

类不会被添加。我在控制台中分别尝试了每一行代码，它们似乎都在做/指向正确的事情。当所有这些都放在一起时，它似乎就不起作用了。

您将值加载到jQuery的DOM ready上，并且不再加载它

您需要测试当前值，而不是DOM就绪时的值，大致如下：

$("#email_address").on("keypress", function() {
    if(email.test($(this).val())) {
        $("#email_address").parent().addClass("has-success");
    }
});

---

不相关，但就我个人而言，我会将电子邮件测试包装在一个函数中，这样就不用说

email.test（xxx）

你可以更自然地阅读它，比如

validEmail（xxx）

等等。

你将值加载到jQuery的DOM ready上，并且不再加载它

您需要测试当前值，而不是DOM就绪时的值，大致如下：

$("#email_address").on("keypress", function() {
    if(email.test($(this).val())) {
        $("#email_address").parent().addClass("has-success");
    }
});

不相关，但就我个人而言，我会将电子邮件测试包装在一个函数中，这样就不用说

email.test（xxx）

你可以更自然地阅读它，比如

validEmail（xxx）

等等