javascript - jquery accordion 只有少数可扩展

Question

如何制作只有几个可扩展选项的 Accordion 菜单？我想要一个菜单​​

主页、支持、销售、其他

主页里面什么也没有，它只是一个链接。所以当你点击主页时，不会发生扩展，它只会执行我告诉链接执行的操作。

支持/销售/其他有几个选项。选项本身就是链接。

$(function() {
  $( ".leftMenu" ).accordion({
     heightStyle: "content",
     active: false,
     collapsible: true,
  });
 });

 <h3><li id='home'>Home</li></h3>
 <h3>Support</h3>
   <div>
      <ul>
        <li>New Tickets</li>
        <li>Existing Tickets</li>
        <li>Contact</li>
      </ul>
   </div>
 <h3>Other</h3>
   <div>
    <li>stuff</li>
    <li>stuff</li>
   </div>
</div>

如果我不在每个 H3 下添加一个 div，它就会变得困惑。

fiddle

Answer 1

Accordion 似乎需要 h 元素之后的 div

例如，对于这个 html，它将按预期工作

<div class='leftMenu'>
    <h3 id ="home">Home</h3>
    <div></div>
     <h3>Support</h3>
      <div>
        <ul>
            <li>New Tickets</li>
            <li>Existing Tickets</li>
            <li>Contact</li>
        </ul>
    </div>
     <h3>Other</h3>

    <div>
        <li>stuff</li>
        <li>stuff</li>
    </div>
</div>

Fiddle

描述:将一对标题和内容面板转换成 Accordion 。 Accordion Docs