2 sinat 36813458 sinat_36813458 于 2017.01.14 16:00 提问

关于js编写二级菜单问题

![![图片说明](https://img-ask.csdn.net/upload/201701/14/1484380709_967739.png)图片说明](https://img-ask.csdn.net/upload/201701/14/1484380698_385697.png)图片说明本来是要点击一级菜单实现隐藏和显示功能的 但是这块点击子菜单也会隐藏 要怎么修改呢?求帮忙

6个回答

qq_29594393
qq_29594393   Ds   Rxr 2017.01.14 16:25
已采纳

http://bbs.csdn.net/topics/350179548

你绑定的点击事件是在li上面 ,但是ul等它的子元素也是它的一部分,点击自然能够 触发 。所以,现在想要达到你想要的 效果,需要判断,鼠标位置下的,当前元素,是不是li。不过这个是走偏了

换个思路你把点击事件,放在a标签上面,点击a标签,让兄弟元素隐藏 显示就可以 。

sinat_36813458
sinat_36813458 非常感谢,明白了~
一年多之前 回复
sinat_36813458
sinat_36813458   2017.01.14 15:58

图片说明

sinat_36813458
sinat_36813458   2017.01.14 15:59

图片说明

qq_29594393
qq_29594393   Ds   Rxr 2017.01.14 15:59

$("一级菜单").click(function(){
$(this).children().toggle();
})

sinat_36813458
sinat_36813458 我没学过jquery...不是很能懂
一年多之前 回复
qq_29594393
qq_29594393   Ds   Rxr 2017.01.14 16:27
 <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>

        <li >
            <button id="btn" onclick="a(this)"> click</button>
            <ul style="display: none;">
                <li>1</li>
                <li>2</li>
                <li>3</li>
            </ul>

        </li>

    </body>
</html>
<script type="text/javascript">
    function a(btn){
        console.log(btn);
        var submenu=btn.nextSibling.nextSibling;
        console.log(submenu);
        if(submenu.style.display=="none"){
            submenu.style.display="block";
        }else{
            submenu.style.display="none";
        }
    }
</script>
u012530334
u012530334   2017.01.14 16:35

.slideBar
{
display:block !important;
}

var displaySubMenu=function(that)
{
$(that).Children("ul").toggleClass("slideBar");
}

/********************/
纯 JS的 不会耶,不好意思哈.

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
html JS左侧下拉二级菜单代码
JS左侧下拉二级菜单代码JS左侧下拉二级菜单代码JS左侧下拉二级菜单代码JS左侧下拉二级菜单代码如题 很漂亮
鼠标经过显示二级菜单js效果
简单无任何修饰效果的,鼠标移动一级菜单上面显示二级菜单的js。 可拓展性高,欢迎下载使用。
js实现鼠标悬停显示二级菜单
js实现鼠标悬停显示二级菜单的具体内容及代码
JS二级菜单联动的实现
JS二级菜单联动的实现***********
js各省联动二级菜单切换
js各省联动二级菜单切换
JS 二级下拉菜单。很漂亮,就是没实现三级下拉
JS 和 CSS 实现的二级下拉菜单,很漂亮。伸缩。但是没有实现三级下拉噢。上传这里,希望爱好者可以扩展为三级纵向下拉
jquery写二级导航菜单
jquery写二级菜单导航,二级菜单导航jquery的写法。js写二级导航。
js导航菜单横向二级菜单
js导航菜单横向二级菜单,支持ie6,ie7,ie8已通过测试,大家可以下载看下
js树形导航菜单制作垂直js导航条特效
js树形导航菜单制作一个垂直纵向js导航条只设置导航二级菜单分类,点击显示隐藏二级菜单目录。内含js代码下载。
js导航菜单左侧竖纵向二级导航菜单可点击展开与收缩子菜单
js导航菜单左侧竖纵向二级导航菜单可点击展开与收缩子菜单