【发布时间】：2015-08-25 21:10:43
【问题描述】：
我制作了一个表格，其中包含显示和隐藏行的复选框，以便更轻松地比较特定行。我想添加不确定的复选框，以便可以同时选择或不选择多行。它有点工作，因为它检查了它下面的框，但即使它被选中，它也不会触发隐藏或显示行的功能。不过，各个复选框仍会触发该功能。
使用复选框显示/隐藏行
$('input[type = checkbox]').change(function () {
var valu = $(this).val();
var ischecked = $(this).is(":checked");
if( ischecked ){
$('.' + valu).show();
}else{
$('.' + valu).hide();
}
});
部门 1 的不确定复选框
$(document).ready(function () {
var checkboxes = document.querySelectorAll('input.div1'),
checkdiv1 = document.getElementById('checkdiv1');
for(var i=0; i<checkboxes.length; i++) {
checkboxes[i].onclick = function() {
var checkedCount = document.querySelectorAll('input.div1:checked').length;
checkdiv1.checked = checkedCount > 0;
checkdiv1.indeterminate = checkedCount > 0 && checkedCount < checkboxes.length;
}
}
checkdiv1.onclick = function() {
for(var i=0; i<checkboxes.length; i++) {
checkboxes[i].checked = this.checked;
}
}
});
第 2 部分的不确定复选框
$(document).ready(function () {
var checkboxes = document.querySelectorAll('input.div2'),
checkdiv2 = document.getElementById('checkdiv2');
for(var i=0; i<checkboxes.length; i++) {
checkboxes[i].onclick = function() {
var checkedCount = document.querySelectorAll('input.div2:checked').length;
checkdiv2.checked = checkedCount > 0;
checkdiv2.indeterminate = checkedCount > 0 && checkedCount < checkboxes.length;
}
}
checkdiv2.onclick = function() {
for(var i=0; i<checkboxes.length; i++) {
checkboxes[i].checked = this.checked;
}
}
});
【问题讨论】：
-
如果我们的某个答案对您有所帮助，请选择其中一个作为答案。
标签： javascript html checkbox