<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function checkAll(e,itemName){ //全选函数 e为全选对象,itemName 为子name
var aa=document.getElementsByName(itemName);
for(var i=0;i<aa.length;i++){
aa[i].checked=e.checked;
}
}
function checkItem(e,allName){ //当选取或取消选取没一个复选框时调用的函数
var all=document.getElementById(allName); //全选框对象
if(!e.checked){ //如果是取消选取那么全选框就取消选取
all.checked=false;
}
else{ //如果是选取,就要判断其他是否都已经全部选取了
var aa=document.getElementsByName(e.name);
for(var i=0;i<aa.length;i++){
if(!aa[i].checked){//如果有一个没有选上,那么就返回
return;
}
}
all.checked=true;//如果其他都选上了,全选框就要选上
}
}
</script>
<head>
<body>
<div id='container'>
<table border=1 id='table1'>
<tr>
<th class='td1'><input type=checkbox id='selectAll' onclick='checkAll(this,"cb");'><label for='selectAll'>全选</label></th>
<th>text</th>
</tr>
<tr>
<td class='td1'><input type=checkbox name='cb' onclick='checkItem(this,"selectAll");'></td>
<td class='center'>11111</td>
</tr>
<tr>
<td class='td1'><input type=checkbox name='cb'
onclick='checkItem(this,"selectAll");'></td>
<td class='center'>22222</td>
</tr>
<tr>
<td class='td1'><input type=checkbox name='cb'
onclick='checkItem(this,"selectAll");'></td>
<td class='center'>33333</td>
</tr>
<tr>
<td class='td1'><input type=checkbox name='cb'
onclick='checkItem(this,"selectAll");'></td>
<td class='center'>44444</td>
</tr>
</table>
</div>
</body>
</html>
checkbox 全选和取消全选
最新推荐文章于 2022-06-01 15:30:28 发布