jQuery Validator，重置密码字段和消息答案

【问题标题】：jQuery Validator, reset password fields and messagesjQuery Validator，重置密码字段和消息
【发布时间】：2012-12-17 22:29:28
【问题描述】：

我正在使用 jQuery Validation 插件进行表单字段验证。想法是，如果表单提交上的任何字段不是有效的密码字段并且它们的错误消息将重置，而其他字段仍然存在。我已经设法重置密码字段，但我无法删除错误消息。

代码在这里：http://jsfiddle.net/2Z9jp/

如果您为所有字段输入无效值并提交，密码输入字段将为空，但错误仍然存在。在这种情况下，我想要的是删除密码字段的错误消息。

似乎高亮发生在 invalidHandler 之后，这导致了这个问题。

代码如下：

<form id="registerForm" class="regForms" method="post" action="/">

        <span>username: </span><input type="text" id="username" name="username" /><br />
        <span class="passwordHolder">
            <span>password: </span><input type="password" id="password1" name="password1" /><br />
        </span>
        <span class="passwordHolder">
            <span>confirm password: </span><input type="password" id="password2" name="password2" /><br />
        </span>

        <input type="submit" />
    </div>
</form>



$("#registerForm").validate({
    rules: {
        username: {
            required: true,
            minlength: 6
        },
        password1: {
            required: true,
            minlength: 6,
            maxlength: 256
        },
        password2: {
            required: true,
            equalTo: "#password1",
            minlength: 6,
            maxlength: 256
        }
    },

    messages: {
        username: {
            required: "required",
            minlength: "should be 6 or longer"
        },
        password1: {
            required: "required",
            minlength: "should be 6 or longer"
        },
        password2: {
            required: "required",
            minlength: "should be 6 or longer",
            equalTo: "should be the same as password"
        }
    },

    invalidHandler: function(form, validator) {
        $(':password').val('');
        $('.passwordHolder label.error').hide();
    }

});

【问题讨论】：

它被标记为必填字段，因此无论您尝试做什么，它总是会被标记为invalid......这就是当字段验证失败时插件应该做的事情。点击submit 两次会返回另一条错误消息。

标签： jquery jquery-validate

【解决方案1】：

我认为您的建议是在 invalidHandler 之后出现高亮显示是绝对正确的。我认为您应该使用 errorPlacement 方法。文档可以在这里找到：

http://docs.jquery.com/Plugins/Validation/validate#toptions

您可以检查密码类型的元素并在这种情况下省略错误放置。

另外一些代码：

$("#myform").validate({
  errorPlacement: function(error, element) {
        if(!element.is(':password'))
              element.after(error);
   },
   debug:true
 })

【讨论】：

我已经尝试过errorPlacement，但这样我将永远不会收到密码验证消息，我只需要在提交时清除它们。

【解决方案2】：

问题是label.error 是在invalidHandler 调用之后添加的。

一种快速的解决方法是使用 setTimeout

setTimeout(function() {
            $('.passwordHolder label.error').hide();
          },100);

【讨论】：

【解决方案3】：

在提交表单时，您可以像这样检查：

$("#registerForm").submit(function(){
    if ($("#password1").valid() == true ) {
       alert('Ok');
    }
});

【讨论】：