是这样子的,我做一个菜单,如下代码:
<nav>
<ul class="memu_ul">
<li></li>
<li></li>
<li></li>
<li></li>
<li>
<ul class="submenu">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</li>
</ul>
</nav>
li标签里面是a连接。我想点击第五个li的时候隐藏和显示子菜单,这个功能我能用toggle做到,但是当我想点击.submenu里面的li的时候,这个菜单一直都是显示的,却做不到。请问怎么才能做到这个功能。是用jquery的。多谢大家了。
$('.memu_ul').find('li:eq(4)').on('click',function(){
$('.submenu').toggle();
})
$('.submenu').find('li').on('click',function(e){
e.stopPropagation();
})
因为你没有 stopPropagation
所以子菜单被点击时,父菜单同样收到点击事件从而被关闭。
只要在子菜单的事件处理中加入 e.stopPropagation()
即可
你点击submenu还是点击触发了第五个li的toggle,因为submenu在第五个li里面。建议
$('memu_ul').on('click', 'li', function(){
$(this).find('.ulbmenu').show();
})
就别用toggle了