Question

我使用jquery验证器addmethod进行验证。单击.btn-md按钮事件时会触发并显示我已发出的警报。但是附加方法不起作用。

HTML代码：

<div class="container">    
    <div class="lg_cont">       
        <h2>Reset your Password</h2>      
        <form method="post" class="lg_form" name="lg_form" id="formresetpwd">  
            <p class="lg_inp"><label for="pwd">Password <span>*</span></label>   
                <!--<span><i class="fa fa-lock"></i></span>-->           
                <input type="password" name="pwd" id="pwd" class="txt"/>            
            </p>         
            <p class="lg_inp">
                <label for="lg_pass">Retype Password <span>*</span></label>        
                <!--<span><i class="fa fa-lock"></i></span>-->       
                <input type="password" name="rpwd" id="rpwd" class="txt"/> 
            </p>         
            <p><label style="font-size:13px;" id="psw_hint" class="hint" for="psw_hint"><span>*</span>Password should atleast contain 6 characters with Alphabet, Numeric and Underscores.</label></p>    
            <p><button type="submit" class="btn btn-success btn-md">Submit</button></p>  
            <?php if (isset($msg)) { ?>                  
                <p><?php echo $msg; ?></p>      
            <?php } ?>       
        </form>      
    </div>   
</div>

Jquery的：

$('.btn-md').on('click', function () {
    alert('test');
   $('#formresetpwd').validate({
        rules: {
            pwd: {
                required: true,
                minlength: 6,
                LowserCase: true,
                Digit: true,
                Special_char: true
            }
        },
        messages: {
            pwd: {
                required: "password is required",
                minlength: "Enter atleast 6 characters"
            }
        },
    });
});
$.validator.addMethod("Uppercase", function (value, element) {
    return this.optional(element) || /[A-Z]/.test(value);
}, "Enter atleast one Capital letter");
$.validator.addMethod("LowserCase", function (value, element) {
    return this.optional(element) || /[a-z]/.test(value);
}, "Enter atleast one Small letter");
$.validator.addMethod("Digit", function (value, element) {
    return this.optional(element) || /[0-9]/.test(value);
}, "Enter atleast one Number");
$.validator.addMethod("Special_char", function (value, element) {
    return this.optional(element) || /[{}|~`"'[\]$&+,:;=?@#|'<>.^*()%!-]/.test(value);
}, "Enter atleast one Special Character");

提前致谢。

Answer 1

您的代码......

$('.btn-md').on('click', function () {
   alert('test');
   $('#formresetpwd').validate({
       ....

点击.btn-md按钮事件时会触发并显示我已发出的提醒。但addmethod无效。

根据您的代码，单击按钮并alert触发，然后调用.validate()方法。什么都不应该发生。

.validate()方法不用于触发验证;它仅用于 初始化 表单上的插件。不属于click处理程序。该插件已捕获click按钮submit，自动触发任何必要的验证。

$(document).ready(function() {

    $('#formresetpwd').validate({  // <- INITIALIZE plugin
        rules: {
            ....
        },
        ....
    });

    $.validator.addMethod( ....

});

工作演示：jsfiddle.net/9vgpLmt5/

Answer 2

你必须设置输入元素class =“pwd”

<input type="password" name="pwd" id="pwd" class="txt pwd"/>

jQuery Validator添加方法不起作用

2 个答案: