ul上的jQuery UI手风琴

Question

当我需要在每个元素上放置一个包装时，如何让jQuery UI Accordion工作？

示例HTML：

<ul> 
    <li> 
    <h3><a href="#">header</a></h3> 
    <div> 
     Content goes here 
    </div> 
    </li> 
    <li> 
    <h3><a href="#">header</a></h3> 
    <div> 
     Content goes here 
    </div> 
    </li> 
</ul> 

我只是似乎无法得到它的工作。

Answer 1

您无法使手风琴与您当前的标记一起工作。元素必须是兄弟姐妹是这样的：

<div id="parentAccordionDiv"> 
    <h3><a href="#">header</a></h3> 
    <div> 
     Content goes here 
    </div> 
    <h3><a href="#">header</a></h3> 
    <div> 
     Content goes here 
    </div> 
</div> 

我认错。我手风琴这样工作得很好：

<script type="text/javascript"> 
    $(function(){ 
     $('#accordion').accordion(); 
    }) 
</script> 
<ul id="accordion"> 
    <li> 
    <h3><a href="#">header</a></h3> 
    <div> 
     Content goes here 
    </div> 
    </li> 
    <li> 
    <h3><a href="#">header</a></h3> 
    <div> 
     Content goes here 
    </div> 
    </li> 
</ul>