Javascript 带“"；悬停“；触发器不'；I don’我开得不够久

使用带有“悬停”触发器的bs下拉菜单时，菜单的可见时间不足以让用户单击菜单项：

使用延迟会使其以意外的方式运行：

---

理想情况下，只要鼠标在菜单上，下拉列表就应该保持不动，当鼠标离开菜单时，下拉列表就会消失。

这是因为当鼠标悬停在实际下拉列表上时，

悬停

伪事件的

mouseleave

会被触发。相反，您可以尝试将容器作为

按钮

本身提供。范例

<button type="button" 
        class="btn btn-lg btn-primary myButton" 
        bs-dropdown="dropdown" 
        data-container=".myButton">Hover to toggle dropdown</button>

悬停以切换下拉列表

在这里，我添加了

data container

作为

myButton

，这是我为同一个按钮提供的类

---

在隐藏时使用延迟是无效的，因为隐藏最终将在动画排队时的指定延迟后发生，因为您将鼠标悬停在按钮外，并将在延迟后隐藏，因此您应该期望用户能够足够快地选择下拉选项。但作为一种解决方法，您可以使用容器，直到提供了修复程序。

有关跟踪此问题进度的信息，请参阅此问题：

---

我正在尝试在引导导航栏上实现下拉菜单。 在阅读Blade1336响应中链接的github问题后，我添加了

data container=“self”

。这使下拉列表足够长的时间可见，可以单击下拉列表项。不幸的是，添加后，菜单下拉项不再可单击

data container=“self”

也导致了用户界面体验有点不稳定。我的代码如下所示：

<li data-match-route="/config*">  
   <a bs-dropdown="configDropdown" data-trigger="hover" data-container="self">Config</a>
</li>

<li data-match-route="/config*" bs-dropdown="configDropdown" data-trigger="hover" data-container="self">
   <a>Config</a>
</li>

配置

最后，我切换了标签，并将bs下拉列表放在我的

标签中，这为我提供了所需的功能（我的链接可以再次单击）。我的代码现在如下所示：

<li data-match-route="/config*">  
   <a bs-dropdown="configDropdown" data-trigger="hover" data-container="self">Config</a>
</li>

<li data-match-route="/config*" bs-dropdown="configDropdown" data-trigger="hover" data-container="self">
   <a>Config</a>
</li>

配置

---

*我保留了

标签只是为了设计样式

谢谢！这很有效。动画“动画flipX”会导致一个错误，下拉列表有时会卡在打开位置。但是移除动画可以修复它。谢谢