自定义jQuery验证规则，用于比较表单

Question

过去几天我一直在寻找答案而没有找到任何答案。我有一个注册表，需要4名团队成员 - 每个团队成员必须提供父母的电子邮件地址。

这些电子邮件地址必须是唯一的 UNLESS 参与者的姓氏是相同的。

例如，如果团队成员＃1的姓氏是Smith，而父电子邮件是parent1@example.com，则团队成员2-4不能使用相同的电子邮件地址（即parent1@example.com） UNLESS < / strong>他们的姓也是史密斯。

这主要是为了说明与同一父母在同一团队中的双胞胎或其他兄弟姐妹。快速Google搜索调出了自定义验证规则，以确保每个输入都是唯一的。下方链接。

http://www.anujgakhar.com/2010/05/24/jquery-validator-plugin-and-notequalto-rule-with-multiple-fields/

这非常有效，可确保父电子邮件的所有必须唯一，但我不知道如何 检查姓氏要求。下面是一些代码。

HTML表单。所有4名团队成员都重复此操作

<h3>Team Member #1 </h3>

<label>First Name</label>
<input type="text" size="38" class="required" name="firstName_1" id="firstName_1">


<label>Last Name</label>
<input type="text" size="38" class="required team-last-name" name="lastName_1" id="lastName_1">


<label>Parent / Guardian Email Address</label>
<input type="text" size="38" class="required distinctemails" name="parentEmail_1" id="parentEmail_1">


<label>Confirm Parent / Guardian Email Address</label>
<input type="text" size="38" class="required" name="confirmParentEmail_1" id="confirmParentEmail_1">

验证码＆amp;自定义规则

jQuery.validator.addMethod("notEqualToGroup", function(value, element, options) {
    // get all the elements passed here with the same class
    var elems = $(element).parents('form').find(options[0]);
    var valueToCompare = value;
    // count
    var matchesFound = 0;
    // loop each element and compare its value with the current value and increase the count every time we find one
    jQuery.each(elems, function(){
        thisVal = $(this).val();
        if(thisVal == valueToCompare){
            matchesFound++;
        }
    });
    // count should be either 0 or 1 max
    if(this.optional(element) || matchesFound <= 1) {
        elems.removeClass('error');
        return true;
    } else {
        elems.addClass('error');
    }
}, jQuery.format("Separate parent email addresses are required for each team member."));

$("#registration_form").validate({
    rules: {
        parentEmail_1: {
            email: true,
            notEqualToGroup: ['.distinctemails']
        }, 
        parentEmail_2: {
            email: true,
            notEqualToGroup: ['.distinctemails']
        }, 
        parentEmail_3: {
            email: true,
            notEqualToGroup: ['.distinctemails']
        }, 
        parentEmail_4: {
            email: true,
            notEqualToGroup: ['.distinctemails']
        }

    },

同样，以上内容非常适合确保每个父电子邮件字段都是唯一的 - 但我不知道如何将这些值与父母的姓氏进行比较，而仅限允许同一封电子邮件父姓的匹配地址。

修改

看起来我的问题存在一些混乱。如果不清楚，我道歉。基本上就是这样：我如何使用jQuery Validate验证表单，以便parentEmail字段对所有四个团队成员都是唯一的 UNLESS parentLastName AND parentEmail匹配？

Answer 1

这不干净，我也不认为它完整。但是，我认为这是一个很好的开始，你可以从这里理解逻辑并改进它。

1）抓取正在验证的相应电子邮件字段的姓氏字段的值...

var nameToCompare = $(element).prevAll('.team-last-name:first').val();

2）抓住循环中每个电子邮件字段的姓氏字段的值...

thisLastName = $(this).prevAll('.team-last-name:first').val();

3）然后在检查重复的电子邮件地址之前在循环中比较这些...

if (thisLastName !== nameToCompare) {
    if (thisVal === valueToCompare) {
        matchesFound++;
    }
}

4）调整发现0的匹配数量，以便通过验证，因为现在它忽略了自己（原本应该）...

if (this.optional(element) || matchesFound === 0) { ....

5）不在自定义方法中添加/删除类。该插件已经自动处理。自定义方法功能的唯一目的是返回与通过或失败相对应的true或false。

DEMO：http://jsfiddle.net/1op3bzzz/

<强>问题：

• 时间：你必须在触发时进行操作。您可以在更改字段后以编程方式触发整个表单上的验证，然后，所有消息都将出现，验证将从“懒惰”更改为“急切”。只有在与电子邮件字段交互时才会触发自定义方法。您还可以在与Last Name字段交互时以编程方式触发它。请参阅the .valid() method。

• 空白：两个空白姓氏字段被视为“匹配”值。使用其他逻辑，您可以过滤掉这些逻辑，除非它们包含值。