jquery写的菜单

最新推荐文章于 2024-08-14 10:15:39 发布

zsw2zkl

最新推荐文章于 2024-08-14 10:15:39 发布

阅读量481

点赞数

分类专栏： JS 文章标签： jquery menu input function html

本文链接：https://blog.csdn.net/zsw2zkl/article/details/7362448

版权

JS 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!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>

复制搜索

zsw2zkl

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery写的菜单

MY JQUERY 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
复制链接

扫一扫

专栏目录