<!DOCTYPE html>
<html>
<!--
作者:18883362590@163.com
时间:2017-08-17
描述:使用html+css+js技术编写一个完整的表格列表内容中 复选框的全选 反选效果
-->
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table border="1">
<tr>
<td><input type="checkbox" id="ckall" οnclick="checkall()" />全选</td>
<td>复选框全选实例</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />1</td>
<td>作用:</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />2</td>
<td>a.单机列头复选框全选或全不选</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />3</td>
<td>c.当所有子项目选中时,列头复选框自动设置为选中状态</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />4</td>
<td>d.将复选框反过来选</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" id="creverse" οnclick="reverse()" />反选</td>
<td>反选实例</td>
<td> </td>
<td> </td>
</tr>
</table>
<script>
function checkall(){
var flag=document.getElementById("ckall").checked;
var ho=document.getElementsByName("box");
for(var i=0;i<ho.length;i++){
ho[i].checked=flag;
}
}
function reverse(){
var ho=document.getElementsByName("box");
for(var i=0;i<ho.length;i++){
ho[i].checked=!ho[i].checked;
}
}
</script>
</body>
</html>
<html>
<!--
作者:18883362590@163.com
时间:2017-08-17
描述:使用html+css+js技术编写一个完整的表格列表内容中 复选框的全选 反选效果
-->
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table border="1">
<tr>
<td><input type="checkbox" id="ckall" οnclick="checkall()" />全选</td>
<td>复选框全选实例</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />1</td>
<td>作用:</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />2</td>
<td>a.单机列头复选框全选或全不选</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />3</td>
<td>c.当所有子项目选中时,列头复选框自动设置为选中状态</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" name="box" />4</td>
<td>d.将复选框反过来选</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="checkbox" id="creverse" οnclick="reverse()" />反选</td>
<td>反选实例</td>
<td> </td>
<td> </td>
</tr>
</table>
<script>
function checkall(){
var flag=document.getElementById("ckall").checked;
var ho=document.getElementsByName("box");
for(var i=0;i<ho.length;i++){
ho[i].checked=flag;
}
}
function reverse(){
var ho=document.getElementsByName("box");
for(var i=0;i<ho.length;i++){
ho[i].checked=!ho[i].checked;
}
}
</script>
</body>
</html>