Question

我正在使用jquery验证来验证我网站上的表单。

由于某种原因，电子邮件验证有效。但是，equalTo和我的自定义要求不起作用。

我错过了一招吗？

 <form id="form1">
             <input class="input1991 savage" name="name" placeholder="Full Name" type="text" ><br>
             <input class="input1991 savage" name="email" placeholder="Email" type="email"><br>
             <input id="password" class="input1991 savage" name="password" placeholder="Password" type="password"><br>
             <input class="input1991 savage" name="password2" placeholder="Password Verification" type="password"><br>
</form>

$(function(){
        $.validator.addMethod('minChar', function(value, element) {
            return this.option(element)
            value.length >= 6;
        }, 'Please enter more then 6 characters')

        $("#form1").validate({
            rules: {
                email: {
                    required: true,
                    email: true,
                },
                name: {
                    required: true,
                    minChar: true
                },
                password: {
                    required: true,
                    minChar: true
                },
                password2: {
                    required: true,
                    equalTo: "#password",
                    minChar: true
                }
            },
            messages: {
                email: {
                    required: 'Please enter test',
                    email: 'test22'
                }
            }
        });
    });

Answer 1

您的验证方法似乎有问题。

只需使用：

return value.length >= 6;

返回true或false。那里没有必要使用元素。

$.validator.addMethod('minChar', minChar, 'Please enter more than 6 characters');

function minChar(value, element) {
    return value.length >= 6;
}

$('#form1').validate({
    rules: {
        name: {
            required: true,
            minChar: true
        }
    }
});

测试用例：

Name = jack;   // false
Name = johnny; // true

Answer 2

这是违反内置equalTo规则的自定义规则。此外，jquery.validate的规则与您已实施的minChar类似。

$('#form1').validate({
  rules: {
    name: {
        required: true,
        minlength: 6
    }
    ...
  }
});

Answer 3

检查JavaScript控制台是否存在错误可能不是一个坏主意。

您的代码......

$.validator.addMethod('minChar', function(value, element) {
    return this.option(element)
    value.length >= 6;
}, 'Please enter more then 6 characters')

不是this.option(element) ......它是this.optional(element)

你也忘记了＆＃34;或＆＃34;运营商。我添加了额外的括号以澄清...

return ( this.optional(element) || (value.length >= 6) );

...完整

$.validator.addMethod('minChar', function(value, element) {
    return this.optional(element) || value.length >= 6;
}, 'Please enter more than 6 characters')

话虽如此，您无需为此创建自定义规则。

Just use the minlength method

$("#form1").validate({
    rules: {
        ....
        name: {
            required: true,
            minlength: 6
        },
        ....

Jquery验证不起作用，只有电子邮件验证工作

3 个答案: