jquery-ui - 带有 jquery 的简单多层手风琴列表

Question

我正在尝试使用 jquery 手风琴样式菜单简化导航树。在其他帖子的帮助下，我觉得我错过了一些简单的东西。让我感到的是，一个类别有第二个子列表。我不能让它正确地打开。关闭。我在这里的示例代码只是不展开“T1 sub b”项目。我错过了什么？

http://jsfiddle.net/9uvgs/203/

html:

    <ul class='menu'>
  <li>Tier1</li>
  <ul>
     <li>T1 sub a</li>
     <li>T1 sub b</li>
         <ul>
           <li>T1 sub i</li>
         </ul> 
  </ul>
  <li>Tier 2</li>
  <ul>
      <li>T2 sub a</li>
      <li>T2 sub a</li>
      <li>T2 sub a</li>
  </ul>
</ul>

jQuery

$(document).ready(function(){
$('ul.menu ul').hide();
$('ul.menu>li').click(function(){
    $(this).next('ul').slideToggle();

});

});

Answer 1

$(document).ready(function(){
    $('ul.menu ul').hide();
    $('ul.menu li').click(function(){
        $(this).next('ul').slideToggle();

    });
});

我已经这样做了，它看起来工作得很好。

Answer 2

您只是将点击事件应用于ul.menu简单解决方案的直接子级，将选择器更改为ul.menu li而不是ul.menu>li

$(document).ready(function(){
    $('ul.menu ul').hide();
    $('ul.menu li').click(function(){
        $(this).next('ul').slideToggle();

    });
});