javascript 测试有效的电子邮件地址

Question

我有这段代码可以让系统使用 "email: true" 测试输入的有效电子邮件地址。它在单击保存按钮后的第一次尝试中起作用，但是在接下来的尝试中，在输入单个字符时还没有单击保存按钮时，它已经测试了输入并已经显示错误消息

  $("#RoleConfigForm").validate({
            rules: {

                "group_code[]": {
                    required: true,
                    maxlength: 25,
                },
                "role_name[]": {
                    required: true,
                    maxlength: 25,
                },

                "email_address[]": {
                    required: true,
                    email: true,
                    maxlength: 30,


                },
            },
            errorClass: "invalid",
            errorPlacement: function (error, element) {
                $('#ResultDialog p').html("@hmis_resources.Message.msg_empty_fields");
                $('#ResultDialog').modal();
            },
            submitHandler: function (form) {
                ajaxFormSubmit();
            }
        });

Answer 1

"Lazy" 对比 "Eager" 验证。

jQuery 验证为 "Lazy"，因此您观察到的是正常的默认行为。

As per the docs here:

By default, forms are validated on submit, triggered by the user clicking the submit button or pressing enter when a form input is focused (option onsubmit). In addition, once a field was highlighted as being invalid, it is validated whenever the user types something in the field (option onkeyup). When the user enters something invalid into a valid field, it is also validated when the field loses focus (option ~~onblur~~ onfocusout).

And here:

Before a field is marked as invalid, the validation is lazy: Before submitting the form for the first time, the user can tab through fields without getting annoying messages – they won't get bugged before having the chance to actually enter a correct value

编辑:

要完全禁用 keyup 和 onblur 验证...

$('#myform').validate({
    onkeyup: false,
    onfocusout: false,
    ....

表单仅在单击按钮时生效。

javascript 测试有效的电子邮件地址

javascript to test valid Email Address

javascript

jquery

jquery-validate