在 Vanilla JS 中单击父级时仅打开一个子菜单

如何解决在 Vanilla JS 中单击父级时仅打开一个子菜单

我正在尝试构建一个带有子菜单的菜单。我使用 forEach 循环遍历菜单项，并在其中使用 for 循环来显示该特定菜单的子菜单。但是，当我单击父菜单时，所有子菜单都会出现（下面的示例 1）

我对 Javascript 还很陌生。有没有办法来解决这个问题？或者也许有更好的方法来做到这一点？。

谢谢！

这里是JS代码：

with open('foo.json','rb') as f:
    data = pickle.load(f)

解决方法

如果没有您的 HTML 或可复制的示例，就很难说。

但是尝试添加索引。

menuLink.forEach(function (element,index) {
  element[index].addEventListener("click",() => {
    for (let i = 0; i < subMenu.length; i++) {
      subMenu[i].classList.toggle("mobile-submenu-visible");
      console.log(subMenu.length);
    }
  });

如果不是这样，我将需要更多来自您的代码。

您在 click 上有一个 menuLink 事件，当点击该事件时，（调用） 会遍历每个 subMenu 项目。您想将 click 事件直接放在 subMenu 上。我会做类似的事情：

let sub;
for(let m of menuLink){ 
  sub = m.querySelectorAll('.mobile-submenu');
  for(let s of sub){
    s.onclick = function(){ 
      this.classList.toggle('mobile-submenu-visible');
    }
  }
}