javascript - jQuery验证equalTo

我想使用带有equalTo的jQuery validate（）插件来验证签名字段，基本上签名字段必须与名字和姓氏字段匹配，使用validate（）插件可以吗？

http://jqueryvalidation.org/equalTo-method/告诉我如何检查它是否等于另一个输入，但是它可以像下面这样吗？

equalTo：field1 + field2

反对

equalTo：field1，

基本上，我要问的是我们可以串联2个字段并在validate（）插件中使用它吗？

                    <li>
                        <label>
                            First Name <span class="form-required">*</span>
                        </label>
                        <div>
                            <input type="text" class="form-textbox"  id="first_name" name="first_name" size="20" value="" required/>
                        </div>
                    </li>
                    <li>
                        <label>
                            Family Name <span class="form-required">*</span>
                        </label>
                        <div>
                            <input type="text" class="form-textbox"  id="last_name" name="last_name" size="20" value="" required/>
                        </div>
                    </li>

$("#myForm").validate({

    // Specify the validation rules
    rules: {

        //First Name
        first_name: "required",

        //Family Name
        last_name: "required"
   },

    // Specify the validation error messages
    messages: {

        //First Name
        first_name: "Please enter your first name",

        //Family Name
        last_name: "Please enter your family name"
   },

    submitHandler: function(form) {
        form.submit();
    }
});

});

最佳答案

我已经做了一个快速的破解来解决这个问题。尽管这可能不是首选的方式，但效果很好。


添加隐藏的输入#fullname
使用以空格分隔的名字和姓氏值填充隐藏的输入
验证签名隐藏者的输入

$("#name1, #name2").on("change", function() {
    $("#fullname").val( $("#name1").val() + " " + $("#name2").val() );
});

jQuery.validator.setDefaults({
  debug: true,
  success: "valid"
});

$( "#myform" ).validate({
  rules: {
    name1: "required",
    name2: "required",
    signature: {
      equalTo: "#fullname"
    }
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
<form id="myform">
    <label for="1st name">1st name</label>
    <input id="name1" name="name1" />
    <br/>
    <label for="2 name">2 name</label>
    <input class="left" id="name2" name="name2" />
    <br/>
    <label for="2 name">Signature</label>
    <input class="left" id="signature" name="signature" />
    <input type="hidden" id="fullname" />
    <input type="submit" value="Validate!" />
</form>

编辑：

至于不区分大小写，您将必须向验证器添加自定义方法，并在添加的方法中进行检查。看一下以下内容。

jQuery.validator.addMethod("anotherNotEqualTo", function(value, element, param) {
    return this.optional(element) || value.toLowerCase() === $(param).val().toLowerCase();
},  "Signature must be equal to your name!");

$( "#myform" ).validate({
  rules: {
    name1: "required",
    name2: "required",
    signature: {
        anotherNotEqualTo: "#fullname"
    }
  }
});

这是一个link to the updated fiddle，以防万一。

希望能有所帮助。

关于javascript - jQuery验证equalTo，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30980452/