具有多个规则的 jQuery 表单验证插件

Question

我正在使用 jQueryValidation 插件。 问题:我想在一个输入字段中使用多个模式规则。例如:

$("form").validate({
 rules: {
    "email": {
        required: true,
        email: true
    },
    "password": {
        required: true,
        pattern: /^[A-Za-z0-9\w]{4,20}/,
        pattern: /^[\d\w\xC4\xD6\xDC\xE4\xF6\xFC\xDF]*$/
    }
 }
});

会发生什么:插件仅测试第二个模式规则。例如。输入类似“tst”的内容可以工作(因为这满足秒模式)，尽管它违反了第一个模式规则。

据我了解此插件中规则的逻辑，所有规则都必须返回 TRUE 才能验证表单。

Answer 1

您不能使用相同的 key:value配对两次，因为第二个实例将覆盖第一个实例。

您有几个选择。

• 将两个正则表达式合并为一个。一种方法将用一条错误消息来声明。因此，不要使用 pattern规则/方法来自additional-methods.js文件中，您将使用 .addMethod() 创建您自己的自定义规则方法。

• 不要组合正则表达式模式，而是使用 pattern规则一次并使用 .addMethod() 创建新的第二条规则.

参见:http://jqueryvalidation.org/jQuery.validator.addMethod/

<小时/>

我会创建一个专用于每个正则表达式模式的自定义方法，并为其指定一个语义相关的名称，例如“电子邮件”、“电话”、“字母数字”、“IP”等。 (这也与此插件内部处理所有正则表达式评估规则的方式相同。)

jQuery.validator.addMethod("foo", function(value, element) {
    return this.optional(element) || /^[A-Za-z0-9\w]{4,20}/.test(value);
}, "Your entered data is not foo");

jQuery.validator.addMethod("bar", function(value, element) {
    return this.optional(element) || /^[\d\w\xC4\xD6\xDC\xE4\xF6\xFC\xDF]*$/.test(value);
}, "Your entered data is not bar");

这样声明...

"password": {
    required: true,
    foo: true,
    bar: true
}