Question

在此处查看问题:(对任何可以提供帮助的人都感到荣幸！）

当密码匹配时，我通过添加类checkMark
要查看问题，请更改第二个密码，使其不匹配且少于6个字符。
我只想删除此特定输入的类（第二个密码字段）

如果用户稍后更改其条目（成功后）导致错误，则所需文本将保持绿色（class未删除）。如何在出错时成功删除class checkMark？

$("#registerForm").validate({       
    rules: {
    createUsername: {
    required: true,
    email: true
},

    createPassword: {
    required: true,
    minlength: 6
    },

    createPassword2: {
    equalTo: "#createPassword",
    minlength: 6
    }
},

messages: {
    createPassword: {
    required: "This field is required.",
    minlength: "Password must be 6-15 characters long."
    }
},

success: function(label) {
    if ( $(label).parent().is('#confirmPassContainer') ) {
        $(label).addClass('checkMark').html('&#x2713;'); 
        }   
    }

});

我尝试过highlight和error方法但没有成功。我在StackOverflow上搜索了高低的答案，但还没有运气。希望使用jQuery解决方案。

Answer 1

在highlight: ...

中使用.validate()

highlight: function (element, errorClass) {
    $(element).siblings('label').removeClass('checkMark');
}

我相信每次表单测试无效时它都会触发...有点与success:相反。

在您的演示中：

http://jsfiddle.net/74u7g/5/

修改

element指的是正在验证的特定input元素。

errorClass指的是插件用于标记错误的class。在此示例中未使用。

因此$(element)选择带有错误的元素，然后.siblings('label')仅选择<label>元素的兄弟，然后.removeClass('checkMark')删除checkMark {{ 1}}。

class

编辑2：

你可能想要添加一个条件来测试它是否在相关的输入元素上，虽然我确信让它在所有元素上运行肯定不会有害。

请参阅：http://jsfiddle.net/74u7g/6/

$(element).siblings('label').removeClass('checkMark');

Answer 2

您可以使用CSS优先级解决问题。

.regForms .error {
    display:block;
    color:#c92a00 !important;
    font-size:12px;
}

在您的情况下，当第二个密码与第一个密码不同时，您有2个CSS规则同时具有2个颜色定义。！important允许您优先考虑错误。

jQuery Validate - 如何删除特定标签上的错误类？

2 个答案: