Question

我正在使用jquery并验证以验证我的表单。我没有向缺少的字段添加元素，而是向元素添加边框使用此选项errorPlacement

$("#signup-form").validate({
       submitHandler: function(form) {
      form.submit();
   },
   errorPlacement: function(error, element) {
      element.css("border", "solid 1px red");
   }                    
});

我似乎无法弄清楚的一件事是如何在有效时清除它？

所以我开始使用上面的代码。然后尝试了，我对结果感到困惑。如果在字段失败时我没有success:选项，则会成功添加该类。但是只要我添加success选项，所有必填字段都会获得该类，如果我检查该元素，我会看到<input class="required invalid valid">，所以我做错了。

           $("#signup-form").validate({
                submitHandler: function(form) {
                    // do other stuff for a valid form
                    //form.submit();
                },
                errorPlacement: function(error, element) {
                    element.addClass("invalid");
                },        
                success: function(error) {
                    // change CSS on your element(s) back to normal
                },                    
                 debug:true
            });

Answer 1

您可以尝试将其添加到.validate()选项列表中......

success: function(error) {
    // change CSS on your element(s) back to normal
}

这应该在没有表单提交的情况下动态工作。一旦错误得到解决，包含的代码就会运行。

请参阅documentation。

请使用jsFiddle创建问题演示。这里的a blank jsFiddle .validate()已经包含在内，可供使用。

修改

根据OP's jsFiddle，我做了这些更改......

errorPlacement: function(error, element) { $(element).filter(':not(.valid)').addClass("invalid"); }, success: function(error) { console.log(error); $("#signup-form").find('.valid').removeClass("invalid"); }

工作演示： http://jsfiddle.net/u3Td3/6/

附注：您还遇到了一些HTML问题。您应该使用input“自我关闭”/>元素。提交按钮也是一样，自我关闭而不是使用</input>。请参阅validator.w3.org以验证您的HTML。我也不会使用table进行布局，使用CSS。

如何在使用jquery validate和自定义errorPlacement时清除错误

1 个答案: