Question

我有一个使用jquery验证的表单，除了这个问题外，它的效果很好。要重现该问题，请填写表单中的所有字段，然后随机选择字段并删除输入。继续这样做，直到错误消息没有出现在顶部，这就是问题所在。

我不确定为什么在删除输入时它不会验证字段。如果有人能告诉我它为什么这样做，那就太好了。我无法在jquery验证网站上的任何演示中重现它，所以我认为这与我设置的方式有关。

$.validator.addMethod("notEqual", function(value, element, param) {
      return this.optional(element) || value != param;
    });

$("#wizardForm").validate({
    rules: {
        firstname: {
            required:{
                depends:function(){
                    $(this).val($.trim($(this).val()));
                    return true;
                }
            },
            pattern: /^[a-zA-Z]+([\s]+)?['-]?([a-zA-Z]+)?$/
        },
        lastname: {
            required: {
                depends:function(){
                    $(this).val($.trim($(this).val()));
                    return true;
                }
            },
            pattern: /^[a-zA-Z]+([\s]+)?['-]?([a-zA-Z]+)?$/
        },
        email: {
            required: {
                depends:function(){
                    $(this).val($.trim($(this).val()));
                    return true;
                }
            },
            email: true,
            notEqual: "demo@somewhere.com",
            pattern: /^(.)+(@)(.)+[.](.)+$/
        },
        password: {
            required: true,
            equalTo: {
                param: "#PWconfirm",
                depends: function(element) {
                  return $("#wizardForm #PWconfirm").val();
                }
            }
        },
        PWconfirm: {
            required: true
        },
        company: {
            required: true
        },   
        zip: {
            required: true
        },         
        country: "required"
    },
    errorLabelContainer: ".validation-error-msg",
    wrapper: "li",
    errorClass: "validation-error",
    messages: {
        firstname: {
            required: "The 'First Name' field cannot be empty.",
            pattern: "The 'First Name' field must not contain numbers or special characters."
        },
        lastname: {
            required: "The 'Last Name' field cannot be empty.",
            pattern: "The 'Last Name' field must not contain numbers or special characters."
        },
        email: {
            required: "The 'Email Address' field cannot be empty.",
            email: "The 'Email Address' must be in a valid email format.",
            notEqual: "This email address is reserved, please use another.",
            pattern: "The 'Email Address' must be in a valid email format."
        },
        password: {
            required: "The 'Password' field cannot be empty.",
            equalTo: "Password fields do not match!"
        },
        company: "The 'Company Name' field cannot be empty.",
        zip: "The 'Zip Code' field cannot be empty.",
        PWconfirm: "The 'Retype Password' field cannot be empty.",
        country: "The 'Country' field needs a valid selection."
    }
});

提前感谢任何建议。

Answer 1

引用OP的评论：

我应该注意，我从不点击提交按钮。填写所有字段，然后取出一些随机字段。

它被称为＆＃34;懒惰验证＆＃34;。它是如何设计插件的。基本上，在第一次单击提交按钮之前，将忽略空字段的错误。

请参阅documentation：

在字段被标记为无效之前，验证是懒惰的：在第一次提交表单之前，用户可以通过字段进行选项卡而不会收到恼人的消息 - 在实际有机会之前，他们不会被窃听输入正确的值

当删除输入时，Jquery验证不会验证

1 个答案: