Bootstrap v4单个导航栏切换器定位的多导航栏toggleable

Question

我有一个.navbar-toggler，我希望将多个切换导航栏作为目标。

我发现this问题与Bootstrap 3完全相同。解决方法是简单地将一个类的toggleger的data-target属性与该类相关联，然后将该类给予所有要导航的导航栏。

此解决方案对我无效。即使在将类选择器作为数据目标之后，只有第一个找到的元素会受到影响。

这是从v3到v4的变化吗？还是有什么我不正确的做法？

这是我的按钮：

<button class="navbar-toggler hidden-lg-up" type="button" data-toggle="collapse" data-target=".exCollapsingNavbar" aria-controls="exCollapsingNavbar" aria-expanded="false" aria-label="Toggle navigation">&#9776;</button> 

而且两者的菜单有相同的类，即：

'collapse navbar-toggleable-md exCollapsingNavbar' 

Answer 1

引导4仍处于Alpha和这周围的错误之一。

https://github.com/twbs/bootstrap/issues/19813

您仍然可以使用JavaScript虽然。

下面是一个简单的替代使用JavaScript：

https://jsfiddle.net/e9xs33pa/2/

HTML：

<button class="navbar-toggler hidden-lg-up" type="button" aria-controls="exCollapsingNavbar" aria-expanded="false" aria-label="Toggle navigation" id="MyID">&#9776;</button> 

<div class="collapse navbar-toggleable-md exCollapsingNavbar">Test</div> 
<div class="collapse navbar-toggleable-md exCollapsingNavbar">Test 2</div> 

JS：

jQuery('#MyID').on('click', function(){ 
    jQuery('.exCollapsingNavbar').collapse('toggle'); 
}); 

基本上，你给按钮的MyID的ID。当按钮被点击时，jQuery折叠会切换exCollapsingNavbar类。