twitter-bootstrap - Twitter Bootstrap 响应式菜单/小型设备：单击菜单项时关闭/折叠菜单

Question

我想通过单击菜单项或单击菜单按钮来更改小型设备上 Twitter 引导菜单的行为以关闭扩展菜单。目前（默认）我只能通过点击右上角的菜单按钮来折叠它，无论我是否点击了链接/菜单项。我该怎么做？我无法从 TB 文档中找出答案，并且在互联网上搜索也没有提供任何答案。

score 7 · Accepted Answer

感谢您修复 Skelly。它在“移动”菜单上运行良好，但不幸的是，它在“桌面”模式下导致视觉缺陷，因为它以 .nav-collapse 为目标，并且此类在两种模式下都处于活动状态。所以，我做了一个小小的修改：

$('.nav li a').on('click',function(){
    $('.navbar-collapse.in').collapse('hide');
})

此修改只会在菜单处于“移动”模式时调用“隐藏”功能。

注意：这仅在 Bootstrap 3 上进行了测试。

score 6 · Accepted Answer

你可以尝试类似..

$('.nav li a').on('click',function(){
    $('.nav-collapse').collapse('hide');
})

这适用于引用“#”的菜单链接。如果您的菜单链接导航到站点上的另一个页面，则菜单应该已经折叠，因为这会导致整个页面刷新。

score 3 · Accepted Answer

您可以通过使用 HTML 来做到这一点，添加data-toggle="collapse" data-target=".in"到锚点

例子：

<li><a href="#" data-toggle="collapse" data-target=".in">Link</a></li>

3 回答 3