jQuery手风琴

Question

只是想知道是否有人可以提供一些关于我试图简化手风琴的基本建议。有一个工作版本，但它似乎太复杂。这是我的新JS。

$(document).ready(function() { 
    $("#themes li ul").hide(); 
    $("#themes li").hover(function() { 
     $("ul").show(); 
     }, function() { 
     $("li ul").hide(); 
    }); 

的标记看起来是这样的：

<ul> 
    <li>Tier 1 
    <ul> 
     <li>Tier 2</li> 
     <li>Tier 2</li> 
    </ul> 
    </li> 
    <li>Tier 1 
    <ul> 
     <li>Tier 2</li> 
     <li>Tier 2</li> 
    </ul> 
    </li> 
</ul> 

我的脚本工作正常的。但是，当任何父母li被徘徊时，它会显示所有孩子的ul，并且当它被隐藏时隐藏所有孩子的ul。只是不知道如何才能让它达到答案。）只有在显示li时才显示li> ul。和B.）只有当另一个被徘徊时（不是它本身），才能隐藏显示的li> ul。示例+解释会特别有用！谢谢！！

Answer 1

为什么不能使用JQuery UI Accordion。这将解决您的问题。 JS的是和HTML是这里

<div id="accordion"> 
    <h3><a href="#">First header</a></h3> 
    <div>First content</div> 
    <h3><a href="#">Second header</a></h3> 
    <div>Second content</div> 
</div> 

jQuery(document).ready(function(){ 
    $('#accordion').accordion(); 
}); 

很简单EDITED

与您的代码的问题是它隐藏和显示任何“礼”组件内的“UL”所有组件上的任何悬停一个李。这里是解决这个问题的代码，这将隐藏/显示当前'li'内的'ul'

  $(document).ready(function() { 
      $("#themes li ul").hide(); 
      $("#themes li").hover(function() { 

       $(this).find("ul").show(); 
       }, function() { 
       $(this).find("ul").hide(); 
      }); 
      });