Question

我有以下代码，在使用jQuery验证插件时会向我的表单添加自定义css样式。

$(document).ready(function() {
    jQuery.validator.setDefaults({
        errorPlacement: function(error, element) {

        // Adds the red outline
        element.parent().addClass("error");

        // Adds the red cross
        element.siblings(".error_status").addClass('check');

        // Removes the default error
        element.removeClass("error");
        }       
    });

 $("#form").validate();

});

为每个元素设置以下html的样式：

<div class="row">
    <label for="id-3"><span>Email address:</span><span class="mark">*</span>
    <input type="text" class="text required" id="id-3" name="email"/>
    <span class="error_status"></span>
</div>

我遇到的问题是我不知道如何在成功验证后删除样式。

Answer 1

您可能希望使用highlight和unhighlight回调（记录为here）而不是errorPlacement。这样，您就不必从元素中手动删除error类：

jQuery.validator.setDefaults({
    highlight: function(element, errorClass) {
        var $element = $(element);
        // Add the red outline.
        $element.parent().addClass(errorClass);
        // Add the red cross.
        $element.siblings(".error_status").addClass("check");
    },
    unhighlight: function(element, errorClass) {
        var $element = $(element);
        // Remove the red cross.
        $element.siblings(".error_status").removeClass("check");
        // Remove the red outline.
        $element.parent().removeClass(errorClass);
    }
});

成功验证后从jQuery.validator中删除样式

1 个答案: