上图是实现效果。
下面贴代码
表的第一行也就是<th>中的代码，onclick事件是实现全选或者全不选效果。
<th>
<input id="allboxs" onclick="allcheck()" type="checkbox"/>
</th>
td中的代码
<td>
<input name="boxs" type="checkbox"/>
</td>
js中实现全选、全不选效果
function allcheck() {
var nn = $("#allboxs").is(":checked"); //判断th中的checkbox是否被选中，如果被选中则nn为true，反之为false
if(nn == true) {
var namebox = $("input[name^='boxs']"); //获取name值为boxs的所有input
for(i = 0; i < namebox.length; i++) {
namebox[i].checked=true; //js操作选中checkbox
}
}
if(nn == false) {
var namebox = $("input[name^='boxs']");
for(i = 0; i < namebox.length; i++) {
namebox[i].checked=false;
}
}
}
以上代码值得一提的是，获取checkbox的值或其他的什么，建议用name属性值操作，因为id属性在每一个页面中默认是唯一的，而name属性则可以取到属性值相同的所有。