编程语言
首页 > 编程语言> > javascript-jQuery验证-向父Div添加错误类

javascript-jQuery验证-向父Div添加错误类

作者:互联网

我正在使用jQuery Validate插件,却永远找不到找到复选框错误的好方法.如果未选择任何复选框,我想用红色突出显示所有复选框标签,并决定通过向包含复选框和复选框标签的div添加一个错误类来做到这一点.但是,它似乎没有添加类.我没有正确选择div吗?

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:

$().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');

标签:javascript,jquery,css,jquery-validate
来源: https://codeday.me/bug/20191010/1887142.html