默认情况下,会选中所有复选框,并且具有父子关系。当取消选中所有复选框时,我想添加一个类。但是 第二个if语句不起作用 -
$(document).ready(function() {
$('#treeList :checkbox').change(function() {
$(this).siblings('ul').find(':checkbox').prop('checked', this.checked);
if (this.checked) {
$(this).parentsUntil('#treeList', 'ul').siblings(':checkbox').prop('checked', true);
}
else {
$(this).parentsUntil('#treeList', 'ul').each(function() {
var $this = $(this);
var childSelected = $this.find(':checkbox:checked').length;
if (!childSelected) {
$this.prev(':checkbox').prop('checked', false);
}
});
}
});
// the second else if statement is not working
if ($('#treelist :checkbox:not(:checked)').length == 0) {
$('.row.cd-feed-wrapper').addClass('visible');
}
else if ($('#treelist :checkbox:checked').length == 0) {
$('.row.cd-feed-wrapper').addClass('hidden');
}
});
页面加载时的第一个。
codepen setup:http://codepen.io/Assert/pen/BLBjpk?editors=1010
<ul id="treeList">
<li>
<input type="checkbox" name="selectedRole" checked> mCRC
<ul>
<li>
<input type="checkbox" name="selectedRole" checked> STIVARGA Efficacy
<ul>
<li>
<input type="checkbox" name="selectedRole" checked> Long-Term Responders
</li>
<li>
<input type="checkbox" name="selectedRole" checked> STIVARGA in Clinical Practice
</li>
</ul>
</li>
<li>
<input type="checkbox" name="selectedRole" checked> STIVARGA AE Management
</li>
<li>
<input type="checkbox" name="selectedRole" checked> Dosing
</li>
<li>
<input type="checkbox" name="selectedRole" checked> Patient Communication
</li>
<li>
<input type="checkbox" name="selectedRole" checked> Case Studies
</li>
</ul>
<li>
<input type="checkbox" name="selectedRole" checked> GIST
</li>
答案 0 :(得分:1)
Rory's comment是一个答案:
您只在页面加载时运行
if
语句。大概你需要将它添加到你的change()
事件处理程序中。
所以把代码放在一个函数中。在ready
,和中调用该函数,在change
处理程序中调用它。
答案 1 :(得分:0)
你的身份证是错的。
您在jquery代码中使用#treelist而不是#treeList。
Javascript不会那样工作
所以在所有情况下它只得到0并进入第一个IF状态。