Bootstrap - 移动菜单中的下拉菜单打开正常，无法关闭下拉菜单

Question

这是网站：https://paperfibresinc.wpengine.com/

网站需要登录才能看到，以下是信誉：

用户：演示 密码：paperfibresinc

如果您使用移动设备并点击“服务”导航菜单项，则会打开下拉菜单，这是完美的。但是，当您尝试再次单击“服务”一词关闭“服务”菜单时，没有任何反应。

知道为什么吗？

Answer 1

因为你使用css来显示下拉列表：

.dropdown:hover .dropdown-menu {
    display: block;
}

如果你想在点击时隐藏下拉菜单，你可以引导组件下拉列表。只需删除此css并将data-toggle="dropdown"添加到“服务”链接，然后设置下拉列表的样式。

Answer 2

试试这个

删除此

CSS

.dropdown:hover .dropdown-menu {
    display: block;
}

并添加此HTML

<a title="Services" href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Services <span class="caret"></span></a>

希望这会有所帮助..