JSCode:
/**
* @author zhangh
*/
function toogleCheckBoxAll(containerId){
var all = $("#"+containerId +" :input") ;
var f = all.eq(0) ;
if(f.attr("type")=="checkbox"&&f.get(0).checked){
$.each(all,function(){
var ipt = $(this) ;
ipt.attr("checked",true) ;
}) ;
}
if(f.attr("type")=="checkbox"&&f.get(0).checked==false){
$.each(all,function(){
var ipt = $(this) ;
ipt.attr("checked",false) ;
}) ;
}
}
Html
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>SelectAll</title>
<script type="text/javascript" src="js/jquery-1.6.2.min.js">
</script>
<script type="text/javascript" src="js/selectAll.js">
</script>
</head>
<body>
<table id="container" width="200" border="1">
<tr>
<td>
<input type="checkbox" onclick="toogleCheckBoxAll('container')"/>
</td>
<td>
姓名
</td>
<td>
年龄
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
张三
</td>
<td>
25
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
王五
</td>
<td>
20
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
钱五
</td>
<td>
30
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
孙七
</td>
<td>
7
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
孙七
</td>
<td>
7
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
孙七
</td>
<td>
7
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
孙七
</td>
<td>
7
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
孙七
</td>
<td>
7
</td>
</tr>
<tr>
<td>
<input type="checkbox"/>
</td>
<td>
孙七
</td>
<td>
7
</td>
</tr>
</table>
</body>
</html>