Question

我有以下jquery：

    <script type="text/javascript" src="./js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function()
    {  
     $(".indexSlideMenu1_Folder div").click(function()
     {
      $(this).removeClass('sliding');
      if ($(this).parent().find('ul').is(':hidden'))
      {                                     
      $(this).parent().find('ul').slideDown(); 
      }
      else
      {
      $(this).parent().find('ul').slideUp(); 
      }
     });  
    });
    </script>

当页面首次加载时，列表只显示Visual Arts。单击Visual Arts时，包括Film列表在内的整个列表将向下滑动。我在点击视觉艺术列表时试图隐藏电影列表。然后，我将选择单击“电影”列表并将其向下滑动。

    <div id="indexSlideMenu1">
    <ul> 
    <li class="indexSlideMenu1_Folder"><div><a href="#">VISUAL ARTS</a></div>
     <ul style="display:none;"> 
      <li><a href="./index.php">(dè)Collage</a></li>
      <li><a href="">Drawing</a></li>
      <li><div><a href="#">Film</a></div><span><!-- empty --></span>
       <ul style="display:none;">
        <li><a href="./index.php">(dè)Collage</a></li>
        <li><a href="">Drawing</a></li>
        <li><a href="">Design</a></li>
        <li><a href="">Painting</a></li>
        <li><a href="">Photography</a></li>
      </ul>
     </li> 
     <li><a href="">Design</a></li>
     <li><a href="">Painting</a></li>
     <li><a href="">Photography</a></li>
     <li><a href="">Print Making</a></li>
     <li><a href="">Sculpture</a></li>
     <li><a href="">Street Art</a></li>
     </ul>
     </li>
     </ul>
     </div>

Answer 1

这样的事情怎么样：

$(".indexSlideMenu1_Folder div").click(function() {
    $(this).removeClass('sliding');
    if ($(this).parent().find('ul:first').is(':hidden')) {
        $(this).parent().find('ul:first').slideDown();
    }
    else {
        $(this).parent().find('ul').slideUp();
    }
});

<强> jsFiddle example

jquery slidedown hide第3级无序列表

1 个答案: