jquery - JQuery嵌套列表的孩子切换整个列表

Question

我有一个看起来像这样的列表

<ul>
   <li class="expandable">Game
     <ul>
        <li>Action</li>
        <li>RPG</li>
     </ul>
   </li>
   <li class="expandable">BBS
     <ul>
       <li class="expandable">Group 1
          <ul>
             <li>Board 1</li>
             <li>Board 2</li>
          </ul>
       </li>
       <li class="expandable">Group 2
          <ul>
             <li>Board 1</li>
          </ul>
       </li>
     </ul>
   </li>
</ul>

以及一些用于折叠列表的 JQuery 代码。

$('li.expandable').click(function() {
    $(this).children('ul').toggle();
});

例如，像“游戏”这样的东西可以正常工作。但是，当我单击 BBS 下的任何嵌套列表（如 Group 1）时，它会导致 Group 1 和 Group 2 折叠到 BBS 中。单击 BBS 将再次展开列表并显示第 1 组已折叠。有一个简单的解决方案吗？

Answer 1

你需要一个return false.

发生的事情是因为您的列表在另一个列表中，它触发了每个列表的点击事件。通过添加return false，它只会触发第一个。

http://jsfiddle.net/4yyau/上的示例