我成功选择了所有框,但我有另一个问题。
我如何取消选中?
这是我的javascript代码:
var tab1 = document.getElementById("tbl1");
var tab2 = document.getElementById("tbl2");
var tab3 = document.getElementById("tbl3");
var tab4 = document.getElementById("tbl4");
var tab5 = document.getElementById("tbl5");
var tab6 = document.getElementById("tbl6");
var tab7 = document.getElementById("tbl7");
var tab8 = document.getElementById("tbl8");
var tab9 = document.getElementById("tbl9");
var elems = document.getElementById("checkall");
if (elems.checked == true) {
tab1.checked = true;
tab2.checked = true;
tab3.checked = true;
tab4.checked = true;
tab5.checked = true;
tab6.checked = true;
tab7.checked = true;
tab8.checked = true;
tab9.checked = true;
}
有没有办法做到这一点?
答案 0 :(得分:4)
为您的孩子复选框提供一个通用的班级名称,例如child-selector
:
var checked = document.getElementById("checkall").checked;
var childElems = document.getElementsByClassName('child-selector');
for(var i=0; i< childElems.length; i++){
childElems[i].checked = checked;
}
答案 1 :(得分:0)
<input type="checkbox" id="tbl1" /><br />
<input type="checkbox" id="tbl2" /><br />
<input type="checkbox" id="tbl3" /><br />
<input type="checkbox" id="tbl4" /><br />
<input type="checkbox" id="tbl5" /><br />
<input type="checkbox" id="tbl6" /><br />
<input type="checkbox" id="tbl7" /><br />
<input type="checkbox" id="tbl8" /><br />
<input type="checkbox" id="tbl9" /><br />
<input type="checkbox" id="checkall" onclick="selectDeselect();" />
<script>
function selectDeselect(){
var elems = document.getElementById("checkall");
for(var i = 1;i<=9;i++){
tab = document.getElementById("tbl" + i);
tab.checked = elems.checked;
}
}
</script>
答案 2 :(得分:0)
使用jQuery使其变得更简单
<input type="checkbox" id="check_all" onclick='check_uncheck();'/>
<input type="checkbox" name="tab[]" id="tbl1" />
<input type="checkbox" name="tab[]" id="tbl2" />
<script>
function check_uncheck() {
jQuery("[name='tab[]']").prop('checked', $('#check_all').prop('checked'));
}
</script>
答案 3 :(得分:0)
var checkAll = elems.checked;
tab1.checked = checkAll;
tab2.checked = checkAll;
tab3.checked = checkAll;
tab4.checked = checkAll;
tab5.checked = checkAll;
tab6.checked = checkAll;
tab7.checked = checkAll;
tab8.checked = checkAll;
tab9.checked = checkAll;
或者您可以为这些复选框命名,document.getElementsByName将返回包含tab1到tab9的元素集合。然后你可以使用for循环来分配属性 希望它有用。