javascript - 如何一次只能打开 1 个 Accordion ？

Question

我有 4 accordions <-- 点击此处查看

• 现在，当我点击“查看报告”时，所有这些都会打开

• 那些 btns 有 class=".sa-hide-btn-[a,b,c,d]"

• 我的 Accordion 琴体有一个 id="sa-collapse-[a,b,c,d]"

• 当我点击它们时，我注意到一个类 in正在切换我的id="sa-collapse-[a,b,c,d]"

<小时/>

我的目标

是调整我的JS，一次只允许1个 Accordion 打开。

• 这意味着如果单击任何 btn:
• 我该下课了 in 从 Accordion 的其余部分中删除并仅添加到被单击的 Accordion 中。

对吗？我的逻辑似乎正确吗？

<小时/>

考虑到这一点 - 我想出了

 var lists = [ "a", "b", "c", "d" ];

    lists.forEach(function(list) {

      $(".sa-report-btn-" + list).click(function () {

        $("#sa-collapse-" + list).removeClass("in");

        $(".sa-hide-" + list).removeClass("hidden");
        $(".sa-report-" + list).addClass("hidden");



      });

      $(".sa-hide-btn-" + list).click(function () {

        $("#sa-collapse-" + list).addClass("in");

        $(".sa-hide-" + list).addClass("hidden");
        $(".sa-report-" + list).removeClass("hidden");
      
      });

<小时/>

结果

每次我点击 Accordion 时，它们仍然会打开。

Fiddle

有人可以告诉我我错过了什么吗？

Answer 1

您有一个名为列表的变量，但在下面，您使用了列表，也许这就是问题所在？