jQuery Validate - 将错误类添加到父Div [英] jQuery Validate - Add Error Class to Parent Div

问题描述

我使用jQuery Validate插件，并且永远找不到一个好的方法来显示复选框的错误。我想突出显示所有的复选框标签为红色，如果没有选择，并决定这样做通过添加一个错误类包含复选框和复选框标签的div。但是，它似乎没有添加类。我不是正确选择div吗？

I am using the jQuery Validate plugin, and can never find a good way to display errors for checkboxes. I'd like to highlight all of the checkbox labels in red if none are selected, and decide to do this by adding an error class to the div that contains the checkboxes and checkbox labels. However, it doesn't seem to be adding the class. Am I not selecting the div correctly?

HTML：

<div class="left-aligned indent">

    <label id="id_label" for="id" class="label">Items:</label>

    <div class="select-group">

        <input type="checkbox" name="items" value="1" id="item_1" />
        <label class="checkbox">Item #1</label><br />

        <input type="checkbox" name="items" value="1" id="item_2" />
        <label class="checkbox">Item #2</label><br />

        <input type="checkbox" name="items" value="1" id="item_3" />
        <label class="checkbox">Item #3</label><br />

    </div>

</div>

Javascript：

Javascript:

$().ready(function() {

    $('#addForm').validate({
        rules: { 
            "items": { 
                required: true, 
                minlength: 1 
            } 
        }, 
        errorPlacement: function(error, element) {
            if (element.is(':checkbox')) {
                $(this).prev("div").addClass('checkbox-error');
            }
            else {
                 return true;
            }
         }
    }); 


});

CSS：

.error {
    background-color: #FF898D;
    border: 1px solid #000;
}

.checkbox-error {
    color: #FF898D;
}

推荐答案

$(element).parent('div').addClass('checkbox-error');

这篇关于jQuery Validate - 将错误类添加到父Div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！