Jquery 为更多字段设置相同的属性_Jquery_Jquery Validate_Validation

Jquery 为更多字段设置相同的属性

jquery validation

Jquery 为更多字段设置相同的属性,jquery,jquery-validate,validation,Jquery,Jquery Validate,Validation,我有两个或多个文本字段，我想对它们应用相同的属性，避免编写两次或多次相同的代码这不起作用： $("#form").validate({ rules: { 'name', 'surname':{ required: true, minlength: 3, maxlength: 50 } } }); 有什么想法吗？将css类应用于所有字段 $(".cssClassName"

我有两个或多个文本字段，我想对它们应用相同的属性，避免编写两次或多次相同的代码

这不起作用：

$("#form").validate({  
    rules:  
    {
    'name', 'surname':{  
        required: true,  
        minlength: 3,
        maxlength: 50   
        }
    }
});

有什么想法吗？

将css类应用于所有字段

$(".cssClassName").rules("add", {
        required: true,  
         minlength: 3,
          maxlength: 50 ,
        messages:
   {required:"error1",minlength:"error2",maxlength:"error3"}});

将css类应用于所有字段

$(".cssClassName").rules("add", {
        required: true,  
         minlength: 3,
          maxlength: 50 ,
        messages:
   {required:"error1",minlength:"error2",maxlength:"error3"}});

将属性定义为变量，然后使用它：

var name_reqs = {  
     required: true,  
    minlength: 3,
    maxlength: 50   
};

$("#form").validate({  
    rules: {
           'name': name_reqs,
        'surname': name_reqs
    }
});

将属性定义为变量，然后使用它：

var name_reqs = {  
     required: true,  
    minlength: 3,
    maxlength: 50   
};

$("#form").validate({  
    rules: {
           'name': name_reqs,
        'surname': name_reqs
    }
});

像这样试试

var ruleSet1 = {
        required: true,  
        minlength: 3,
        maxlength: 50
    };

$('#form').validate({
    rules: {
        field_1: ruleSet1,
        field_2: ruleSet1,
        field_3: ruleSet1
    }
});

或者像下面这样一个接一个地做

$("#form").validate({  
    rules:  
    {
    name: { required: true },
    surname:{  
        required: true,  
        minlength: 3,
        maxlength: 50   
        }
    }
});

像这样试试

var ruleSet1 = {
        required: true,  
        minlength: 3,
        maxlength: 50
    };

$('#form').validate({
    rules: {
        field_1: ruleSet1,
        field_2: ruleSet1,
        field_3: ruleSet1
    }
});

或者像下面这样一个接一个地做

$("#form").validate({  
    rules:  
    {
    name: { required: true },
    surname:{  
        required: true,  
        minlength: 3,
        maxlength: 50   
        }
    }
});

显然，有几种方法可以做到这一点，但如果您使用

然后你可以像这样设定你的规则

$("#form").validate({  
    rules:  
    {
     firstname : name, 
     surname : name
    }
});

或使用类名设置规则：

<input id="firstname" name="firstname" class="name">
<input id="surname" name="surnname" class="name">

这个方法在jQuery验证一般指南的一节中进行了讨论。

显然有几种方法可以做到这一点，但是如果您使用

然后你可以像这样设定你的规则

$("#form").validate({  
    rules:  
    {
     firstname : name, 
     surname : name
    }
});

或使用类名设置规则：

<input id="firstname" name="firstname" class="name">
<input id="surname" name="surnname" class="name">

此方法在jQuery验证一般指南的一节中进行了讨论。

摘自：

在我的示例中，这是基本的起始代码：

HTML：

<input type="text" name="field_1" />
<input type="text" name="field_2" />
<input type="text" name="field_3" />

$('#myForm').validate({
    rules: {
        field_1: {
            required: true,
            number: true
        },
        field_2: {
            required: true,
            number: true
        },
        field_3: {
            required: true,
            number: true
        }
    }
});

演示：

选项1a）您可以根据所需的通用规则为字段分配类，然后将这些规则分配给类。您还可以分配自定义消息

HTML:

演示：

选项1b）与上述相同，但它不使用

类

，而是匹配名称属性的公共部分：

$('[name*="field"]').each(function() {
    $(this).rules('add', {
        required: true,
        number: true,
        messages: { // optional custom messages
            required:  "your custom message",
            number:  "your custom message"
        }
    });
});

演示：

选项2a）您可以拉出规则组并将它们组合成公共变量

var ruleSet1 = {
        required: true,
        number: true
    };

$('#myForm').validate({
    rules: {
        field_1: ruleSet1,
        field_2: ruleSet1,
        field_3: ruleSet1
    }
});

演示：

选项2b）与上述2a相关，但取决于您的复杂程度，您可以分离出某些组通用的规则，并使用这些规则以无数种方式重新组合它们

var ruleSet_default = {
        required: true,
        number: true
    };

var ruleSet1 = {
        max: 99
    };
$.extend(ruleSet1, ruleSet_default); // combines defaults into set 1

var ruleSet2 = {
        min: 3
    };
$.extend(ruleSet2, ruleSet_default); // combines defaults into set 2

var ruleSet3 = { };
$.extend(ruleSet3, ruleSet1, ruleSet2); // combines sets 2 & 1 into set 3.  Defaults are included since they were already combined into sets 1 & 2 previously.

$('#myForm').validate({
    rules: {
        field_1: ruleSet2,
        field_2: ruleSet_default,
        field_3: ruleSet1,
        field_4: ruleSet3
    }
});

最终结果：

```
字段_1
```
将是不少于3的必填数字
```
字段_2
```
将只是一个必需的数字
```
字段_3
```
将是不大于99的必填数字
```
字段_4
```
将是介于3和99之间的必填数字

演示：

取自：