求帮忙写个js展开菜单
<liclass="submenu"><aclass="dropdown"href="javascript:;"data-original-title="主菜单1"><s...
<li class="submenu"><a class="dropdown " href="javascript:;" data-original-title="主菜单1"><span aria-hidden="true" class="icon icon-magnifier-add"></span><span class="hidden-minibar "> 主菜单1</span><span class="fa arrow"></span></a>
<ul style="display: none;">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span></a></li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span></a></li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span></a></li>
</ul>
</li>
<li class="submenu"><a class="dropdown " href="javascript:;" data-original-title="主菜单2"><span aria-hidden="true" class="icon icon-magnifier-add"></span><span class="hidden-minibar "> 主菜单2</span><span class="fa arrow"></span></a>
<ul style="display: none;">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span></a></li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span></a></li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span></a></li>
</ul>
</li>
展开主菜单1的时候,主菜单2收缩,不会js,求大神帮忙写下。谢谢 展开
<ul style="display: none;">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span></a></li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span></a></li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span></a></li>
</ul>
</li>
<li class="submenu"><a class="dropdown " href="javascript:;" data-original-title="主菜单2"><span aria-hidden="true" class="icon icon-magnifier-add"></span><span class="hidden-minibar "> 主菜单2</span><span class="fa arrow"></span></a>
<ul style="display: none;">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span></a></li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span></a></li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span></a></li>
</ul>
</li>
展开主菜单1的时候,主菜单2收缩,不会js,求大神帮忙写下。谢谢 展开
2个回答
展开全部
<li class="submenu"><a class="dropdown " href="javascript:showMenu(1);" data-original-title="主菜单1"><span aria-hidden="true" class="icon icon-magnifier-add"></span><span class="hidden-minibar "> 主菜单1</span><span class="fa arrow"></span></a>
<ul style="display: none;" id="ul1">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span></a></li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span></a></li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span></a></li>
</ul>
</li>
<li class="submenu"><a class="dropdown " href="javascript:showMenu(2);;" data-original-title="主菜单2"><span aria-hidden="true" class="icon icon-magnifier-add"></span><span class="hidden-minibar "> 主菜单2</span><span class="fa arrow"></span></a>
<ul style="display: none;" id="ul2">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span></a></li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span></a></li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span></a></li>
</ul>
</li>
<script>
function showMenu(s){
if(s == 1){
document.getElementById("ul1").style.display="block";
document.getElementById("ul2").style.display="none";
}else if(s == 2){
document.getElementById("ul2").style.display="block";
document.getElementById("ul1").style.display="none";
}
}
</script>
这样就行了
追问
、。。。不止二个菜单的,没说清楚,对不起饿。。。
追答
数量是不定的还是有定值?如果数量是定值的话,就在ul标签上加ID,然后在showMenu方法里面往上叠加就行
推荐于2016-06-20
展开全部
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>menu</title>
<style type="text/css">
</style>
<script type="text/javascript">
onload = function ()
{
var lis = document.querySelectorAll ("li.submenu");
var funny = function (i)
{
lis[i].onclick = function ()
{
var status = this.querySelector ("ul").style.display;
this.querySelector ("ul").style.display = status == "none" ? "block" : "none";
if (lis.index >= 0 && lis.index != i)
{
lis[lis.index].querySelector ("ul").style.display = "none";
}
lis.index = i;
};
};
for ( var i = 0; i < lis.length; i++)
{
funny (i);
}
}
</script>
</head>
<body>
<ul>
<li class="submenu"><a class="dropdown " href="javascript:;" data-original-title="主菜单1"><span aria-hidden="true"
class="icon icon-magnifier-add"></span><span class="hidden-minibar "> 主菜单1</span><span class="fa arrow"></span> </a>
<ul style="display: none;">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span> </a>
</li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span> </a>
</li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span> </a>
</li>
</ul></li>
<li class="submenu"><a class="dropdown " href="javascript:;" data-original-title="主菜单2"><span aria-hidden="true"
class="icon icon-magnifier-add"></span><span class="hidden-minibar "> 主菜单2</span><span class="fa arrow"></span> </a>
<ul style="display: none;">
<li><a href="/agent/Order.asp" data-original-title="子菜单1"><span class="hidden-minibar "> 子菜单1</span> </a>
</li>
<li><a href="/agent/OrderBuy.asp" data-original-title="子菜单2"><span class="hidden-minibar "> 子菜单2</span> </a>
</li>
<li><a href="/agent/tkinfo.asp" data-original-title="子菜单3"><span class="hidden-minibar "> 子菜单3</span> </a>
</li>
</ul></li>
</ul>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询