<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>全选</title>
<script>
//全选按钮选中,单选按钮全部选中,
function TabClick(){
var flag=document.getElementById("checkboxID").checked;
if(flag==true){
var check_arr=document.getElementsByName("checkboxIDD");
var count=check_arr.length;
for(var i=0;i<count;i++){
check_arr[i].checked=true;
}
}
else{
var check_arr=document.getElementsByName("checkboxIDD");
var count=check_arr.length;
for(var i=0;i<count;i++){
check_arr[i].checked=false;
}
}
}
//如果单选按钮全部选中,则全选按钮选中,如果有一个单选按钮没有选中,则全选按钮不选中
function onclickFlag() {
var check_arr=document.getElementsByName("checkboxIDD");
var count=check_arr.length;
for(var i=0;i<count;i++){
if(check_arr[i].checked==false){
document.getElementById("checkboxID").checked=false;
return;
}
else
{
document.getElementById("checkboxID").checked=true;
}
}
}
</script>
</head>
<body>
<table id="tab" border="1px" width="500px" height="200px">
<thead>
<tr>
<th><input id="checkboxID" type ="checkbox" onclick="TabClick()" />全选</th>
<th>12</th>
<th>13</th>
<th>14</th>
</tr>
</thead>
<tbody>
<tr>
<td><input name="checkboxIDD" id="aa" type="checkbox" onclick="onclickFlag()"/>单选</td>
<td>22</td>
<td>23</td>
<td>24</td>
</tr>
<tr>
<td><input name="checkboxIDD" type="checkbox" onclick="onclickFlag()"/>单选</td>
<td>32</td>
<td>33</td>
<td>34</td>
</tr>
<tr>
<td><input name="checkboxIDD" type="checkbox" onclick="onclickFlag()"/>单选</td>
<td>42</td>
<td>43</td>
<td>44</td>
</tr>
</tbody>
</table>
</body>
</html>