javascript - jQuery嵌套手风琴 - 禁用自动打开

Question

我正在尝试使#subAccordion1父级 ( #accordion) 中的手风琴 ( ) 默认关闭（注意：只有一个子手风琴）。

我在这样做时遇到了一些麻烦..

这是我尝试过的 jQuery：

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

还有我的 HTML：

<div id = "accordion">
     <h1>Accordion1:</h1>
     <div>
         <p>Blah</p>

         <div id = "subAccordion1">
             <h1>Accordion1.1</h1>
             <div>
                 <p> BLAH BLAH BLAH</p>
             </div>
         </div>
      <h1>Accordion2:</h1>
      <div>
           <p>Blah</p>
      </div>
</div>

2 个外部手风琴（1 和 2）按预期工作，只是内部的手风琴（1.1）自动展开！

谢谢你的帮助

Answer 1

首先修复您的 HTML（缺少关闭 div）：

<div id = "accordion">
     <h1>Accordion1:</h1>
     <div>
         <p>Blah</p>
         <div id = "subAccordion1">
             <h1>Accordion1.1</h1>
             <div>
                 <p> BLAH BLAH BLAH</p>
             </div>
         </div>
      </div>
      <h1>Accordion2:</h1>
      <div>
           <p>Blah</p>
      </div>
</div> 

JavaScript

$(function() {
  // init parent accordion
  $("#accordion").accordion( { heightStyle: "content" });

  // init sub accordion via #id selector with options object
  $("#subAccordion1").accordion({
                autoHeight: false,
                active: false,
                collapsible: true,
                heightStyle: "content"
   });
});

Answer 2

尝试

$("#accordion, #subAccordion1").accordion({

代替

$("#accordion, #subAccordion1").accordion(function() {