<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MY JQUERY</title>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
var num = 0;
function checkMain(obj){
var flag = $(obj).attr("checked");
var tem = $(obj).parent().next().find("input[type=checkbox][name=menu]");
if(flag){
tem.attr("checked",true);
num=tem.length;
}else{
tem.attr("checked",false);
num=0;
}
}
function checkSub(obj){
var flag = $(obj).attr("checked");
var numSibling = $(obj).parent().parent().parent().find("input[type=checkbox][name=menu]").length;
if(flag){
num++;
if(num == numSibling){
var tem = $(obj).parent().parent().parent().prev().find("input[type=checkbox][name=menu]");
tem.attr("checked",true);
}
}else{
num--;
if(num == 0){
var tem = $(obj).parent().parent().parent().prev().find("input[type=checkbox][name=menu]");
tem.attr("checked",false);
}
}
}
</script>
</head>
<body>
<ul>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkMain(this)" />
菜单1
</div>
<ul>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkSub(this)" />
菜单1.1
</div>
</li>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkSub(this)" />
菜单1.2
</div>
</li>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkSub(this)" />
菜单1.3
</div>
</li>
</ul>
</li>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkMain(this)" />
菜单2
</div>
<ul>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkSub(this)" />
菜单2.1
</div>
</li>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkSub(this)" />
菜单2.2
</div>
</li>
</ul>
</li>
<li>
<div>
<input type="checkbox" name="menu" onClick="checkMain(this)" />
菜单3
</div>
</li>
</ul>
</body>
</html>
扫一扫
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
