本文详解如何在 bootstrap 4.5 中禁用默认的「单开互斥」行为，使多个导航栏下拉菜单可同时保持展开状态，适用于侧边栏（sidemenu）等需要多级独立展开的场景。

本文详解如何在 bootstrap 4.5 中禁用默认的「单开互斥」行为，使多个导航栏下拉菜单可同时保持展开状态，适用于侧边栏（sidemenu）等需要多级独立展开的场景。

在 Bootstrap 4.5 的默认行为中，当一个 .dropdown 组件被打开时，其他已展开的下拉菜单会自动收起——这是由其内部事件机制（如 hide.bs.dropdown）控制的「互斥逻辑」。但在侧边栏（sidemenu）、管理后台或树形导航等场景中，开发者常需支持多个下拉菜单并行展开，以提升信息层级可见性与操作效率。本文提供一套稳定、轻量、符合 Bootstrap 事件规范的解决方案。

核心原理：拦截非主动关闭行为

Bootstrap 的 hide.bs.dropdown 事件会在下拉菜单即将关闭时触发，并附带 e.relatedTarget 属性，指向触发该关闭动作的 DOM 元素（通常是另一个下拉触发器）。我们利用这一特性，在事件处理中判断：
✅ 若 relatedTarget 是当前被点击的触发器 → 用户主动点击关闭，允许关闭；
❌ 若 relatedTarget 是其他触发器 → 属于「因打开新菜单而连带关闭」，此时调用 e.preventDefault() 阻止默认关闭行为。

该方案不破坏 Bootstrap 原生生命周期，兼容 show.bs.dropdown、hidden.bs.dropdown 等后续事件，且不影响键盘导航（如 ESC 关闭）和触摸设备交互。

完整实现代码

将以下 JavaScript 代码置于 Bootstrap 和 jQuery 加载之后（推荐放在