在页面加载和更改时根据选择和复选框显示/隐藏 div答案

【问题标题】：Show/hide div based on select and checkboxes when page loads and on change在页面加载和更改时根据选择和复选框显示/隐藏 div
【发布时间】：2014-03-14 00:33:19
【问题描述】：

i具有更改选择框时显示的DIV。在这些 div 中是复选框，选中时会显示子 div。我让它工作，以便在选择更改时显示/隐藏 div，并在选中/取消选中时显示/隐藏后续子 div。

// Show/Hide checkbox divs using select
$('#set').change(function(){
    $('.checkboxes').hide();
    $('#' + $(this).val()).show();
});

// Show/Hide sub questions using checkboxes
$('div.checkboxes input[type="checkbox"]').on('change', function() {
    $('#' + this.id + '-qs').toggle( this.checked ); 
});

How can I make it so that the first level div is displayed when an option element already has the selected attribute?

<option value="set1" selected>One</option>

当复选框具有选中属性时也是如此？

<input type="checkbox" name="set1-questions1" id="set1-questions1" checked>

DEMO

即上面的演示应该显示，里面应该显示。

谢谢

【问题讨论】：

标签： jquery

【解决方案1】：

您可以在页面加载时触发change() 事件：

// Show/Hide checkbox divs using select
$('#set').change(function(){
    $('.checkboxes').hide();
    $('#' + $(this).val()).show();
}).change(); // or .trigger('change');

Updated Fiddle

【讨论】：