本文主要是介绍JQ点击展开二级菜单,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
JQuery控制点击展开二级菜单,以下为测试代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<title>JQ点击展开二级菜单</title>
<script class="jquery library" src="jquery-1.8.2.min.js" type="text/javascript"></script>
<script>
jQuery(function($){
$("ul>li>a").click(function(){
$(this).next("ul").toggle().closest("li").siblings("li").children("ul").hide();
}).next("ul").hide();
});
</script>
</head>
<body>
<ul>
<li>
<a>
一级菜单
</a>
<ul>
<li>
隐藏的二级菜单项
</li>
<li>
隐藏的二级菜单项
</li>
<li>
隐藏的二级菜单项
</li>
</ul>
</li>
<li>
<a>
一级菜单
</a>
<ul>
<li>
隐藏的二级菜单项
</li>
<li>
隐藏的二级菜单项
</li>
<li>
隐藏的二级菜单项
</li>
</ul>
</li>
<li>
<a>
一级菜单
</a>
<ul>
<li>
隐藏的二级菜单项
</li>
<li>
隐藏的二级菜单项
</li>
<li>
隐藏的二级菜单项
</li>
</ul>
</li>
</ul>
</body>
</html>
这篇关于JQ点击展开二级菜单的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!