Question

jquery 如何实现折叠菜单

Answer 1

知道你要啥样的，就说个最简单的竖列折叠菜单吧,比如：

菜单1

    子菜单1

    子菜单2

    ……

菜单2

    子菜单1

    子菜单2

    ……

如果要做这样的折叠菜单 那html为：

<div class="menu">
    <div>菜单1</div>
    <ul>
        <li>子菜单1</li>
        <li>子菜单2</li>
        ……
    </ul>
</div>

<div class="menu">
    <div>菜单1</div>
    <ul>
        <li>子菜单1</li>
        <li>子菜单2</li>
        ……
    </ul>
</div>

css为：(没样式只有功能，样式自己去加)

.menu ul{ display:none}

js为：

$('.menu').click(function(){
    $(this).find('ul').slideToggle();
)}

Answer 2

<div>
    <span>菜单1</span>
    <ul>
        <li>内容1</li>
        <li>内容2</li>
        <li>内容3</li>
        <li>内容4</li>
    </ul>
</div>
css部分：
div{width:20px;height:auto;float:left}
span{display:block;width:200px; float:left;height:40px;text-align:center;line-height:40px}
ul,li{list-style:none}

js部分：
$(function(){
    $('span').click(function(){
        $('ul').slideToggle(300)
    })
})

Answer 3

首先你要有一个合理的html结构，然后再在这个结构上做折叠菜单

Answer 4

利用class="cur"，点击事件当前菜单添加class。parents下其他菜单removecss