jquery 高手进 急求jquery 实现树形菜单 如图 最好是能带上注释 着急的很
展开全部
简单写了一个，仅供参考
<!doctype>
<html>
<head>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<style type="text/css">
#tree li{}
#tree li ul{display:none;}
</style>
<script type="text/javascript">
$(function(){
var $tree = $("#tree");//获取tree
var $a_tops = $tree.children("li").children("a");//找到tree下第一层菜单
$a_tops.bind("click", function(){//为第一层菜单绑定事件
var $this = $(this).next("ul");
if($this.length > 0){//判断当前第一层菜单下是否有第二层菜单
$this.is(":hidden") ? $this.show() : $this.hide();//根据状态判断是隐藏还是现实第二层菜单
}
});
});
</script>
</head>
<body>
<ul id="tree">
<li><a href="javascript:void(0)">保险单管理</a>
<ul>
<li><a href="">添加报销单</a></li>
<li><a href="">审核报销单</a></li>
</ul>
</li>
<li><a href="javascript:void(0)">我要采购</a>
<ul>
<li><a href="">信心收件箱</a></li>
<li><a href="">信心发件箱</a></li>
</ul>
</li>
</ul>
</body>
</html>
<!doctype>
<html>
<head>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<style type="text/css">
#tree li{}
#tree li ul{display:none;}
</style>
<script type="text/javascript">
$(function(){
var $tree = $("#tree");//获取tree
var $a_tops = $tree.children("li").children("a");//找到tree下第一层菜单
$a_tops.bind("click", function(){//为第一层菜单绑定事件
var $this = $(this).next("ul");
if($this.length > 0){//判断当前第一层菜单下是否有第二层菜单
$this.is(":hidden") ? $this.show() : $this.hide();//根据状态判断是隐藏还是现实第二层菜单
}
});
});
</script>
</head>
<body>
<ul id="tree">
<li><a href="javascript:void(0)">保险单管理</a>
<ul>
<li><a href="">添加报销单</a></li>
<li><a href="">审核报销单</a></li>
</ul>
</li>
<li><a href="javascript:void(0)">我要采购</a>
<ul>
<li><a href="">信心收件箱</a></li>
<li><a href="">信心发件箱</a></li>
</ul>
</li>
</ul>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
