手风琴 - 打开另一项时关闭一项答案

【问题标题】：Accordion - close one item when opening another one手风琴 - 打开另一项时关闭一项
【发布时间】：2019-01-15 00:43:09
【问题描述】：

我想在另一项打开时自动关闭一项，因此任何时候只有一项打开。

HTML

<ons-list-item tappable class="accordion" onclick="fn.toggle(this)">List 1</ons-list-item>
  <div class="panel">
    <ons-list-item tappable>Item 1</ons-list-item>
    <ons-list-item tappable>Item 2</ons-list-item>
  </div>

window.fn = {};
window.fn.toggle = function(el) {
    el.classList.toggle("active");
    el.nextElementSibling.classList.toggle("show");
}

【问题讨论】：

我不确定是否要求只使用 JavaScript，如果不是，请查看 jQuery UI - Accordion
快速而肮脏的方法是 onClick 关闭所有面板，然后只打开被点击的面板。不会影响已经关闭的面板。
这是我在互联网上找到的一个简单示例，看看你是否能在其中找到答案。 codepen.io/sureshrkm/pen/ZbzBpr

标签： javascript html onsen-ui onsen-ui2

【解决方案1】：

这就是答案：

window.fn = {};
window.fn.toggle = function(el) {
  var elems = document.querySelectorAll(".accordion.active");
[].forEach.call(elems, function(els) {
  if (el != els) {
  els.classList.toggle("active");
    els.nextElementSibling.classList.toggle("show");
  }
});
    el.classList.toggle("active");
    el.nextElementSibling.classList.toggle("show");
}

【讨论】：