Javascript 保持<；细节>；单击标记中的内容后，在应用closeAll后打开标记

我使用

和

标记创建了可折叠菜单，其中包含打开页面上某些元素的按钮，但当我单击按钮时，它会关闭折叠菜单。单击菜单中的按钮后，如何保持折叠菜单处于打开状态

我使用

onclick=“closeAll（）”

在打开一个菜单时关闭所有菜单，但只需在单击菜单中的按钮后保持菜单打开（以显示用户导航的位置）

以下是我的部分代码：

<details onclick="closeAll()">
  <summary>
    <div class="menubut" id="butmotors"><img src="gfx/menu_motors.png" /></div>
  </summary>
  <input type="button" value="Your Garage" class="sub_but" onclick="your_garage();"><br />
  <input type="button" value="Travel By Car" class="sub_but" onclick="travel();"><br />
  <input type="button" value="Car Dealership" class="sub_but" onclick="car_dealership();"><br />
  <input type="button" value="Street Race" class="sub_but" onclick="street_racer();"><br />
  <input type="button" value="Gas Station" class="sub_but" onclick="show_gas_station();">
</details>';

function closeAll() {
  var i, a = document.getElementsByTagName('details');
  for (i in a) {
    a[i].open = '';
  }
}

';
函数closeAll（）{
var i，a=document.getElementsByTagName（'details'）；
为了（我在a）{
a[i]。开放=“”；
}
}

我要做的第一件事是停止使用内联事件属性

然后，为了能够将事件处理程序绑定到另一个也有事件处理程序的元素的子元素（您的按钮），您需要知道的技巧是jQuery

这将防止事件冒泡到父级

下面（作为奖励），我只使用了一个绑定到

子单元的函数，但是所有按钮都使用了
类。然后，使用，根据单击按钮的值决定要执行的操作

标签很有趣。我不知道。它有一个布尔属性来展开/折叠它。。。但令人惊讶的是，对于已折叠的，值是
false
，对于已打开的（
true
似乎不起作用……这很好知道）


//箭头单击处理程序
$（“详细信息”）。在（“单击”，函数（）上{
log（“您单击了详细信息箭头”）；
//关闭所有其他详细信息标签。
$（“详细信息”）。每个（函数（）{
this.open=false；
});
});
//按钮单击处理程序
$（“.sub_but”）。在（“单击”）上，函数（事件）{
//使事件从冒泡中结束
event.stopPropagation（）；
//评估单击了哪个按钮
开关（此值）{
案例“你的车库”：
log（“你点击了车库”）；
//在这里做一些具体的事情。。。
打破
案例“乘车旅行”：
log（“您单击了乘车旅行”）；
//在这里做一些具体的事情。。。
打破
案例“汽车经销商”：
console.log（“您点击了汽车经销商”）；
//在这里做一些具体的事情。。。
打破
「街头赛马」个案：
log（“你点击了街头比赛”）；
//在这里做一些具体的事情。。。
打破
案例“加油站”：
log（“你点击了加油站”）；
//在这里做一些具体的事情。。。
打破
}
});









其他一些细节。。。
知道什么有趣？
这是我需要的最后一个代码，Louys Patrice Bessette的回答绝对正确谢谢

    // The arrow click handler
$("details").on("click",function(){
  //console.log("You clicked on the detail arrow");

  // Close all other details tags.
  $("details").each(function(){
    this.open = false;
  });
});

// The button click handler
$(".sub_but").on("click",function(event){

  // To top the event from bubbling up
  event.stopPropagation();

});

非常感谢您抽出时间回答我的问题。我真的非常感谢您的帮助，我在这方面已经坚持了三天：）