jquery - 如何只向下滑动当前元素

Question

我有以下 HTML。

<div id="myid">
   <ul class="someclass">
      <li class="static">
         <a href="#"><span>Page1</span></a>
         <ul class="someclass">
            <li class="static"><a href="page1a.php"><span>Page1A</span></a></li>
            <li class="static"><a href="page1b.php"><span>Page1B</span></a></li>
         </ul>
      </li>
      <li class="static">
         <a href="#"><span>Page2</span></a>
         <ul class="someclass">
            <li class="static"><a href="page2a.php"><span>Page2A</span></a></li>
            <li class="static"><a href="page2b.php"><span>Page2B</span></a></li>
         </ul>
      </li>
   </ul>
</div>

使用以下代码，我试图根据用户点击的链接展开和折叠。因此，如果用户单击“Page1”，它将展开(如果已经展开则折叠)并显示 Page1A 和 Pag1B。同样点击 Page2 也会有同样的效果。但是当我使用以下代码时，它会展开和折叠页面上的所有元素，而不是我点击的当前元素。

$('#myid > ul > li > a').click(function()
{
   if($(this).closest("li").children("ul").is(':visible') == false)
      $('#myid > ul > li > ul').slideDown('normal');
   else
      $('#myid > ul > li > ul').slideUp('normal');
});

Answer 1

你需要$(this)...

$(this).next('ul').slideDown('normal');

代替

$('#myid > ul > li > ul').slideDown('normal');