1.这是checkbox:
<td><input type="checkbox" id="checkAll" onclick="checkBox()" /></td>
<td><input type="checkbox" name="ids" /></td>
<td><input type="checkbox" name="ids" /></td>
<td><input type="checkbox" name="ids" /></td>
这种是使用原生的js技术与一点点JQuery技术,通过dom节点获取checkbox,判断checkbox的选中状态
function checkBox(){
var checkAll= document.getElementById('checkAll'); //获取checkAll
var checkbox = document.getElementsByName("ids"); //获取所有checkbox
//如果checkAll是选中状态,遍历所有checkbox,checkbox的选中状态
if(checkAll.checked){
$(checkbox).each(function(){
this.checked = true;
})
}else{ 如果checkAll不是选中状态,遍历所有checkbox,checkbox不选中状态
$(checkbox).each(function(){
this.checked = false;
});
}
2020年12月23日 11:21:06更新JQuery新实现方法:
直接写一个JQuery函数,选择selectallrows绑定点击事件,所有name=doccheckbox的框都会跟着selectallrows的checked状态所改变:
prop(“checked”,this.checked);
当selectallrows.checked为true,那么doccheckbox.checked为true
当selectallrows.checked为false,那么doccheckbox.checked为false
$(function(){
$("#selectallrows").click(function(){
$("tbody input[name='doccheckbox']").prop("checked",this.checked);
console.log(this.checked);
)}
})