Javascript 如何使用Zurb基金会6折叠所有折叠手风琴

要默认打开手风琴部分，需要为li标记添加“is active”类。像这样：

<li class="accordion-item is-active" data-accordion-item>
    <a href="#0" class="accordion-title"><h5>This is the title</h5></a>
    <div class="accordion-content" data-tab-content>
      <p>This is the content
      </p>
</li>

---

您可以按如下操作，运行代码段并查看它的实际操作

$（document.foundation（）；
函数closeAll（）{
$（'.accroot'）。每个（函数（）{
var$acc=$（本）；
var$openSections=$acc.find（'.accordion-item.is-active.accordion-content'）；
$openSections.每个（函数（i，节）{
$acc.foundation（'up'，$（章节））；
});
});
}

全部关闭


小组1。同侧阴唇


小组2。同侧阴唇


小组3。同侧阴唇

为了补充Jatin的答案，“全部打开”功能如下所示（除了“向上”到“向下”之外还有一个变化）：

---

我知道这有点晚了，但我今天遇到了这个问题，在花了几个小时的时间（这方面有点新），使用Jatin的代码，我创建了一个带有示例的代码笔。使用Javascript函数，该函数将扩展或折叠，而不管不同手风琴的状态如何（如果存在打开/关闭的混合）

参考请参见此

$（document.foundation（）；
$（文档）.ready（函数（）{
$（“.toggle accordion”）。打开（“单击”，函数（）{
var accordioid=$（this.attr（“accordion id”）；
$（this.toggleClass（“手风琴展开”）；
triggeraccordins=document.queryselectoral（“.accordins展开”）；
if（triggerAccordions.length==0）{
collapseAll（）；
}否则{
expandAll（）；
}
});
});
函数collapseAll（）{
$（“.accordion”）。每个（函数（）{
var$acc=$（本）；
var$openSections=$acc.find（“.accordion-item.is-active.accordion content”）；
$openSections.每个（函数（i，节）{
$acc.foundation（“up”，美元（章节））；
});
});
};
函数expandAll（）{
$（“.accordion”）。每个（函数（）{
var$acc=$（本）；
var$openSections=$acc.find（“.accordion item.accordion content”）；
$openSections.每个（函数（i，节）{
$acc.foundation（“向下”，美元（部分））；
});
});
};
正文{
颜色：#6a6c6f；
背景色：#f1f3f6；
边缘顶部：30px；
}
.集装箱{
最大宽度：960像素；
右侧填充：15px；
左侧填充：15px；
右边距：自动；
左边距：自动；
}
.手风琴选项{
宽度：100%；
浮动：左；
明确：两者皆有；
利润率：15px0；
}
.手风琴选项.标题{
字体大小：20px；
字体大小：粗体；
浮动：左；
填充：0；
保证金：0；
}
.手风琴选项.切换手风琴{
浮动：对；
字体大小：16px；
颜色：#6a6c6f；
}
.手风琴选项。切换手风琴：之前{
内容：“扩大所有”；
}
.手风琴选项.切换手风琴.手风琴展开：之前{
内容：“全部崩溃”；
}

手风琴示例






可折叠组项目#1
知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除了偶尔出于谨慎，不应该因为疏忽而受到惩罚





可折叠组项目#2
知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除了偶尔出于谨慎，不应该因为疏忽而受到惩罚





可折叠组项目#3
知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除了偶尔出于谨慎，不应该因为疏忽而受到惩罚



当我查看ZURB基金会的文档时，我看到了属性“数据允许所有关闭=真”这个名称。您可以尝试使用jQuery将其添加为属性。它工作得非常好！谢谢你的邀请，你能帮我弄清楚当手风琴关闭时，我应该用哪个部分打开它，这样我就可以创建某种开-关切换了。：）Hi@BaimHK，要关闭所有手风琴，请更改行
$acc.foundation（'up'，$（部分））至
$acc.foundation（'down'，$（节））我尝试了Jatin提供的开放式解决方案，但它不起作用，您的效果很好谢谢！我想
    $(document).ready(function(){
    $(".testClass").click(function(){
        $("li").removeClass("is-active");
    });
});

function openAll() {
  $('.accroot').each(function () {
    var $acc = $(this);
    var $openSections = $acc.find('.accordion-item .accordion-content');
    $openSections.each(function (i, section) {
      $acc.foundation('down', $(section));
    });
  });
}