标签：
a.父级选中 子级都选中
b.子级一个选中 父级就选中
c.全选或者全部选中
<script type="text/javascript">
$(function(){
$("#checkedAll").click(function(){
var flag = this.checked;
$(":checkbox[name=‘items‘]").attr("checked", flag);
});
$(":checkbox[name=‘items‘]").click(function(){
var _cbClass = $(this).attr(‘class‘); //获取父级的class元素
if(_cbClass){//判断是否有元素，有的话则是父级复选框
var _isChecked = $(this).is(":checked"); //获取是否选中
$(":checkbox[pid=‘"+_cbClass+"‘]").attr("checked",_isChecked);//根据父级是否选中的状态设置子级的状态
}else{//操作子级复选框
var _pid = $(this).attr(‘pid‘);//获取pid的值
if($("input[pid="+_pid+"]").is(":checked")==true){
$(":checkbox[class=‘"+_pid+"‘]").attr("checked",true);//判断子级是否有选中，有的话父级选中
}else{
$(":checkbox[class=‘"+_pid+"‘]").attr("checked",false);
}
}
});
});
</script>
html部分：
<body>
<form method="post" action="">
<div style="margin-left:30px;">权限设置
<input type="checkbox" id="checkedAll" />全选/全不选
<div style="border:solid 1px #ebebeb; padding-left:70px; padding-top:20px; margin-top:15px;">
<input type="checkbox" name="items" class="id_1"/><span style="font-size:18px; color:#36F;">广州</span>
<ul>
<li><input type="checkbox" name="items" pid="id_1"/>白云区</li>
<li><input type="checkbox" name="items" pid="id_1"/>越秀区</li>
</ul>
<input type="checkbox"name="items" class="id_2" /><span style="font-size:18px; color:#36F;">北京</span>
<ul>
<li><input type="checkbox" name="items" pid="id_2"/>白云区</li>
<li><input type="checkbox" name="items" pid="id_2"/>白云区</li>
</ul>
</div>
</div>
</form>
</body>
标签：
原文地址：http://www.cnblogs.com/hFannie/p/4565532.html
