Jquery UI Accordion - 折叠和可点击的链接

Question

我正在尝试将 Jquery UI 手风琴用作侧边导航选项。问题是我无法让手风琴在加载时（以及在用户需要时）完全折叠并在某些面板标题上具有活动链接。

使用 jQuery 1.6.2 & jQuery UI 1.8.16。

$(function() {
$( "#accordion" ).accordion({
    active: false,
    collapsible: true,
    autoHeight: false,
});
});

<div id="accordion">
<h3><a href="http://link1.html">Outside Link 1</a></h3>
<div></div>
<h3><a href="http://link2.html">Outside Link 2</a></h3>
<div></div>
<h3><a href="http://link3.html">Outside Link 3</a></h3>
<div></div>

<h3><a href="#">More Info</a></h3>
<div class="subNav">
    <ul>
    <li><a href="pageLink1.html">Another Page 1</a></li>
    <li><a href="pageLink2.html">Another Page 2</a></li>
    <li><a href="pageLink3.html">Another Page 3</a></li>
    </ul>
</div>

     <h3><a href="http://link4.html">Outside Link 4</a></h3>
<div></div>

<h3><a href="#">More Info 2</a></h3>
<div class="subNav">
    <ul>
    <li><a href="pageLink4.html">Another Page 4</a></li>
    <li><a href="pageLink5.html">Another Page 5</a></li>
    <li><a href="pageLink6.html">Another Page 6</a></li>
    </ul>
</div>
   ...etc
   </div>

“外部链接”应直接链接到其他页面。 “更多信息和更多信息 2”应该打开，以便用户可以分别选择“另一个页面”。

如果我更改标题选择器，我无法在加载或单击时折叠手风琴（我可以通过这种方式访问​​“外部链接”）。我的空 div 可能是罪魁祸首吗？

感谢任何帮助。提前致谢。

Answer 1

你很幸运。有人为此做了一个插件。

http://www.i-marco.nl/weblog/jquery-accordion-3/# 它的工作方式如你所愿。