jquery - 使用 jquery 折叠/展开 ul 列表

Question

我发现了这段代码(如下)，它折叠/展开“ul”列表

它工作正常，但我需要每次展开“ul”时，关闭所有其他“ul”。

http://jsfiddle.net/mtCWr/2/

  <ul class="list">
    <li>
        <a>Rifles</a>
        <ul>
            <li>M16</li>  
            <li>MP5</li>  
            <li>AR15</li>  
            <li>M16A1</li>            
        </ul>                
    </li>

    <li>
        <a>Guns</a>
        <ul>
            <li>Magnum</li>  
            <li>Colt</li>      
        </ul>                
    </li>
</ul>​

JS

$('.list > li a').click(function() {
    $(this).parent().find('ul').toggle();
});​

Answer 1

您需要将以下行添加到点击处理程序中以关闭任何打开的 ul:

$('.list > li a').click(function() {
    $('.list ul:visible').hide(); // this closes any open ul
    $(this).parent().find('ul').toggle();
});

Example fiddle