如何使用jQuery Validate插件验证电子邮件

Question

在某些情况下，jQuery Validate插件不适用于电子邮件验证。 “ abc@test.c”（单字母后缀）和“중국어@ test.com”（非字母数字）作为有效电子邮件地址传递。

如何使用jQuery Validate插件过滤这两个无效的电子邮件地址？

Answer 1

根据文档 ，您将需要构造自己的自定义方法。

添加自定义验证方法。 它必须由名称（必须是合法的javascript标识符），基于javascript的函数和默认字符串消息组成。

参数：

名称; 字符串用于标识和引用它的方法名称，必须是有效的javascript标识符

方法; 回调实际的方法实现，如果元素有效，则返回true。 第一个参数：当前值。 第二个参数：Validated元素。 第三个参数：参数。

消息（可选）； 字符串，函数此方法要显示的默认消息。 可以是由jQuery.validator.format（value）创建的函数。 如果未定义，则使用已经存在的消息（便于本地化），否则必须定义特定于字段的消息。

---

以下是我命名为newemail的自定义method 。 现在，它只是使用默认功能进行“电子邮件”验证。 只需在此函数中编辑正则表达式即可满足您的特定需求。

jQuery.validator.addMethod("newemail", function(value, element) {
            // contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
            return this.optional(element) || /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))$/i.test(value); 
}, "Please enter a valid email address");

然后在.validate()使用它，就像使用其他任何规则一样。

rules: {
    InputName: {
        required: true,
        newemail: true
    }
}

Answer 2

这是我使用remote:解决方案：

$("#myForm").validate({
    rules: {
        femail: {
            required: true,
            email: true,
            remote: "lib/ajax/checkEmail.php"
        }
    },
    messages: {
        femail: {
            required: 'Please input email',
            email: 'Please input valid email',
            remote: 'This email is duplicated/invalid, please re-input an email'
        }
    },
    submitHandler: function(form) {
        form.submit();
    }
});

在checkEmail.php ，它实现了额外的逻辑来验证特殊情况，然后至少回显true或false 。

希望能帮助到你。