Question

Bootstrap 3多级下拉菜单无法在移动设备上运行。我在StackOverflow中检查了很多解决方案。桌面解决方案不适用于移动设备。以下是多lebel下拉菜单的最佳解决方案。

https://github.com/djokodonev/bootstrap-multilevel-dropdown

$('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) {
  // Avoid following the href location when clicking
  event.preventDefault();
  // Avoid having the menu to close when clicking
  event.stopPropagation();
  // If a menu is already open we close it
  $('ul.dropdown-menu [data-toggle=dropdown]').parent().removeClass('open');
  // opening the one you clicked on
  $(this).parent().addClass('open');
});

以上代码适用于桌面。

实例：http://rahulmoral.com/portfolio/essanet/

请在移动设备上查看。二级下拉菜单不适用于移动设备。

Answer 1

它实际上工作得很好。您需要滚动才能看到展开的菜单。但是，要让它按照您的喜好工作，只需覆盖max-height：

.navbar-collapse {
    max-height: none;
}

Answer 2

我把它添加到我的css

@media screen and (max-width: 767px){
.navbar-fixed-top .navbar-collapse{
    max-height:100%;
} }

但不是100％，你也可以不使用。我正在使用固定导航，这就是为什么我有导航栏固定顶部。你可以将它改为静态或w.e.你正在使用。

Bootstrap 3多级下拉菜单无法在移动设备上运行

2 个答案: