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或show。 哪里有問題？

Answer 1

您可以使用.is（）

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

而不是if($('input.pokazkontakt').prop(':checked'))

演示

Answer 2

嘗試這個：

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迭代所有復選框

DEMO