根据复选框值显示或隐藏Div

Question

我想根据复选框值显示div。我试过以下

$(document).ready(function() { 
    $('#parent').change(function() { 
    if (this.checked) { 
    $('#child').css('display', 'block'); 
} 
    else { 
    $('#child').css('display', 'none'); 
} 
}); 

}）;

现在它的工作，如果我检查#parent复选框。但问题是复选框是在一个窗体中。下次刷新页面时，即使复选框被选中，它仍然不显示任何内容。

如何选中此复选框被选中或显示无显示。

感谢

Answer 1

触发使用change()或trigger('change')方法

$(document).ready(function() { 
    $('#parent').change(function() { 
    if (this.checked) { 
     $('#child').css('display', 'block'); 
    } else { 
     $('#child').css('display', 'none'); 
    } 
    }).change(); 
}); 

---

还可以减少使用toggle()方法的代码更改事件。

$(document).ready(function() { 
    $('#parent').change(function() { 
    $('#child').toggle(this.checked); 
    }).change(); 
}); 

Answer 2

试试这个：

$(document).ready(function() { 
    $('#parent').change(function() { 
    if($(this). prop("checked") == true){ 
     $('#child').css('display', 'block'); 
    } 
    else { 
     $('#child').css('display', 'none'); 
    } 
});