Jquery 当我进入我的手风琴页面时，我看到了我的最后一个手风琴<；h3>；收回，当我使用'active:false'时`

我在使用jQuery accordion，我有一个问题

如果在我启动jQuery的函数中，我使用

active:0，

它工作正常，当我访问我的手风琴页面时，我打开了我的第一个手风琴

但是当我使用

active:false，

时，当我访问我的手风琴页面时，或者当我刷新此页面时，我总是看到我的最后一个手风琴要收回

我试图使用

active:false，

，因为当我访问我的手风琴页面时，我看到我所有的手风琴都关闭了，但我不想在访问页面时看到这种收缩效果

你明白为什么我会错吗

这是我的html：

 <div class="accordion ative">
     <h3><a href="#">Title 1</a></h3>
           <ul>
              <li><a href="#">Link 1</a></li>
              <li><a href="#">Link 2</a></li>
           </ul>
</div>         

 <div class="accordion ative">
     <h3><a href="#">Title 2</a></h3>
           <ul>
              <li><a href="#">Link 3</a></li>
              <li><a href="#">Link 4</a></li>
           </ul>
</div>  

---

您应该按id而不是类调用accordions，您正在多次初始化accordions。jQuery类选择器将匹配多个手风琴。为每个手风琴指定一个id，并为每个手风琴配置按#id选择每个手风琴

$(function() {
  $('#accordion1').accordion({
    active: 2,   
    collapsible: true,
    heightStyle: "content",
    icons: { header: 'ui-icon-plus', activeHeader: 'ui-icon-minus'}
   });

  $('#accordion2').accordion({
     active: false,   
     collapsible: true
   });


});


    <div id="accordion1" class="accordion ative">
        <h3><a href="#">Title 1</a></h3>
        <ul>
            <li><a href="#">Link 1</a></li>
            <li><a href="#">Link 2</a></li>
        </ul>
    </div>

    <div id="accordion2" class="accordion ative">
        <h3><a href="#">Title 2</a></h3>
        <ul>
            <li><a href="#">Link 3</a></li>
            <li><a href="#">Link 4</a></li>
        </ul>
    </div>

$（函数（）{
$（'手风琴1'）。手风琴({
活动：2，
可折叠的：是的，
高度样式：“内容”，
图标：{header:'ui图标加'，activeHeader:'ui图标减'}
});
$（'手风琴2'）。手风琴({
活动：错误，
可折叠：正确
});
});

不知道为什么看到手风琴缩回对您来说是一个很大的细节。感谢您的回答Brian Odgen。这似乎是一个很好的解决办法。但是我有一些问题！！调用$（'#accordionWrapper'）.show（）之前是否尝试使用超时；在调用我的包装器之前使用timenout，但我现在尝试了，问题还在继续！Brian Odgen如果我只使用你的代码，它就正常工作了。但我有三个手风琴配置，因为我需要在我的项目中为active 3个不同的选项。当我使用我的3个手风琴配置时，我总是有我的问题…你知道为什么会发生这种情况吗？你应该按id而不是类调用手风琴，你正在多次初始化手风琴。jQuery类选择器将匹配多个手风琴。给出每个手风琴和id，并根据每个手风琴配置的#id选择每个手风琴。

$(function() {
  $('#accordion1').accordion({
    active: 2,   
    collapsible: true,
    heightStyle: "content",
    icons: { header: 'ui-icon-plus', activeHeader: 'ui-icon-minus'}
   });

  $('#accordion2').accordion({
     active: false,   
     collapsible: true
   });


});


    <div id="accordion1" class="accordion ative">
        <h3><a href="#">Title 1</a></h3>
        <ul>
            <li><a href="#">Link 1</a></li>
            <li><a href="#">Link 2</a></li>
        </ul>
    </div>

    <div id="accordion2" class="accordion ative">
        <h3><a href="#">Title 2</a></h3>
        <ul>
            <li><a href="#">Link 3</a></li>
            <li><a href="#">Link 4</a></li>
        </ul>
    </div>