javascript - jQuery。如果选中复选框，则检查 onload 并将 css 添加到 div

Question

我的问题

jQuery(document).ready(function () {

if ($('input.pokazkontakt').prop(':checked')) {
    $(this).parent().nextAll('.pkbox:first').css('display', 'block');
} else {
    $(this).parent().nextAll('.pkbox:first').css('display', 'none');
}

$('input.pokazkontakt').click(function () {
    $(this).parent().nextAll('.pkbox:first').toggle('fast');
});
});

演示

JS 的第二部分正在工作（toogle），但我想先检查是否选中了复选框并隐藏 div 或显示。哪里有问题？

Answer 1

尝试这个：

jQuery(document).ready(function () {

    $('input.pokazkontakt').each(function(){
        if ($(this).is(':checked')) {
            $(this).parent().nextAll('.pkbox:first').css('display', 'none');
        } else {
            $(this).parent().nextAll('.pkbox:first').css('display', 'block');    
        }
    });

    $('input.pokazkontakt').click(function () {
        $(this).parent().nextAll('.pkbox:first').toggle('fast');
    });
});

• display:none当您设置和时，反向使用您的逻辑display:block。
• 用于.is检查检查状态。
• 用于.each迭代所有复选框

演示

Answer 2

您可以使用.is()

if($('input.pokazkontakt').is(':checked'))

代替 if($('input.pokazkontakt').prop(':checked'))

演示