javascript - Bootstrap : Dropdown child element without dropdowning parent element on navbar

Question

我有一个 Bootstrap 导航栏菜单。我的内容是:“菜单项”和“下拉项”

在响应模式下，我想在不打开“菜单项”的情况下访问“下拉项”内容

我的代码:

    <div class="navbar-header">

      <button type="button" data-toggle="collapse" data-target="#navbar-collapse-1" class="navbar-toggle">Menu</button>

      <button type="button" data-toggle="collapse" data-target="#navbar-collapse-2" class="navbar-toggle">Dropdown Item Content</button>        

      <a href="" class="navbar-brand">Brand</a>

    </div>


    <div id="navbar-collapse-1" class="navbar-collapse collapse">

      <ul class="nav navbar-nav">

        <li class="dropdown"><a href="#">Menu Item</a></li>

        <li class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Dropdown Item <b class="caret"></b></a>

            <ul id="navbar-collapse-2" class="dropdown-menu">
                    <li>text</li>
            </ul>

        </li>

      </ul>

    </div>


</div>

**

jsFiddle

https://jsfiddle.net/mj8qgakz/

**

-- 以响应模式查看: 当我单击“菜单”并单击“下拉项内容”后，内容打开。

我想在不点击“菜单”的情况下实现同样的效果

bootstrap可以吗？

Answer 1

如果你只是想隐藏手机上的菜单项，像这样:

<li class="dropdown hidden-xs"><a href="#">Menu Item</a></li>

如果我理解这个问题......不确定