<html>
<head>
<title>checkbox check all test!</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
<!--
function checkBoxAll(allBoxId,childBoxName) {
var allBox = $("#" + allBoxId);
var childBox = $("input[@name='" + childBoxName + "']");
allBox.click(function(){
if($(this).attr("checked") == true){
childBox.each(function(){
$(this).attr("checked",true);
});
}else{
childBox.each(function(){
$(this).attr("checked",false);
});
}
});
childBox.each(function() {
$(this).click(function() {
for(var i = 0; i < childBox.length; i++) {
if(!$(childBox[i]).attr("checked")) {
allBox.attr("checked",false);
break;
}
allBox.attr("checked",true);
}
});
});
}
$(document).ready(function() {
checkBoxAll('allCheck1','allCheck1Child');
checkBoxAll('allCheck2','allCheck2Child');
});
//-->
</script>
</head>
<body>
<input type="checkbox" id="allCheck1" /> 全选<br />
</span><input type="checkbox" name="allCheck1Child" /> 一
<input type="checkbox" name="allCheck1Child" /> 二
<input type="checkbox" name="allCheck1Child" /> 三
<div style="height:10px;"></div>
<input type="checkbox" id="allCheck2" /> 全选二 <br />
<input type="checkbox" name="allCheck2Child" /> 11111
<input type="checkbox" name="allCheck2Child" /> 22222
<input type="checkbox" name="allCheck2Child" /> 33333
</body>
</html>