jquery - 带有 jQ​​uery 验证插件的自定义方法

Question

我试图在 Jquery 中使用自定义验证。所有的编码部分都是正确的，但我不知道哪里出错了……这是代码的一部分。

Password:<input type="password" id="pnameTxt" name="pnameTxt" placeholder="Enter Password" size=12 class='required'><br>
Confirm Password:<input type="password" id="pnameTxt2" name="pnameTxt2" placeholder="Retype Password" size=15 class='required passwordCheck'><br>

自定义验证方法：

 $.validator.addMethod("passwordCheck",function (value,element){
          return value==$("#pnameTxt").val(); 

        }, 'Password and Confirm Password should be same');

Answer 1

您的代码正在运行。当您使用 初始化插件时，您还必须将规则分配给您的字段.validate()。

工作演示：http: //jsfiddle.net/KrLkF/

$(document).ready(function () {

    $.validator.addMethod("passwordCheck", function (value, element) {
        return value == $("#pnameTxt").val();
    }, 'Password and Confirm Password should be same');

    $('#myform').validate({ // initialize the plugin
        rules: {
            pnameTxt2: {
                passwordCheck: true
            }
        }
    });

});

---

但是，您不需要为此功能编写自定义方法。jQuery Validate 插件已经有一个equalTo规则，这里是如何使用它。

工作演示：http: //jsfiddle.net/tdhHt/

$(document).ready(function () {

    $('#myform').validate({ // initialize the plugin
        rules: {
            pnameTxt2: {
                equalTo: "#pnameTxt" // using `id` of the other field
            }
        },
        messages: {
            pnameTxt2: {
                equalTo: "Password and Confirm Password should be same"
            }
        }
    });

});

Answer 2

您是否正确初始化了验证插件？当我将 html 放入 aform然后initialize the plugin它按预期工作时。

<form id="test">
Password:<input type="password" id="pnameTxt" name="pnameTxt" placeholder="Enter Password" size=12 class='required'><br>
Confirm Password:<input type="password" id="pnameTxt2" name="pnameTxt2" placeholder="Retype Password" size=15 class='required passwordCheck'><br>
<input type="submit">
</form>

$.validator.addMethod("passwordCheck",function (value,element){
      return value==$("#pnameTxt").val(); 

    }, 'Password and Confirm Password should be same');

$('#test').validate();