时间戳

首页 > 解决方案 > 如何在其他子菜单关闭时一次打开 1 个子菜单

javascript - 如何在其他子菜单关闭时一次打开 1 个子菜单

问题描述

我一直试图一次打开一个子菜单，但我似乎找不到我的问题！环顾四周，但没有找到任何可以帮助我的东西，而且它还必须在页面加载时保持关闭 ----HTML ---

HTML 部分

       window.addEventListener('load', function(){


   var acc = document.getElementsByClassName("niveau1");
   var i;

for (i = 0; i < acc.length; i++) {
    acc[i].onclick = function() {
        hideAll();

        this.classList.toggle("active");
        this.nextElementSibling.classList.toggle("show");
    }
}

function hideAll() {
    for (i = 0; i < acc.length; i++) {
        acc[i].classList.toggle("active", false);
        acc[i].nextElementSibling.classList.toggle("show", false);
    }
}

});

标签： javascripthtml

解决方案

如果可以使用JQuery，就可以使用JQuery 的.accordain功能。在这里找到。

例如：

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="accordion">
  <h3>Section 1</h3>
  <div>
    <p>
      Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque.
    </p>
  </div>
  <h3>Section 2</h3>
  <div>
    <p>
      Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus.
    </p>
  </div>
</div>


<script>
  $(function() {
    $("#accordion").accordion({
      active: false,
      collapsible: true
    });
  });
</script>

JSFiddle

请注意，这要求您拥有<div>而不是<li>.

推荐阅读