微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

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

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

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

所以我从上面的代码开始.然后尝试了,我对结果感到困惑.
如果我没有成功:当一个字段失败时,它会成功添加该类.但是,只要我添加成功选项,所有必填字段都会获得该类,如果我检查该元素,我会看到< input class =“required invalid valid”>所以我做错了什么.

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

解决方法

您可以尝试将此添加到.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>.请参阅validator.w3.org以验证您的HTML.我也没有使用表格进行布局,使用CSS.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐