Question

我正在尝试在选择搜索按钮时在移动导航栏中打开下拉项。因此，搜索按钮打开移动导航，现在我想打开此下拉项目，以便用户可以立即看到所有搜索过滤器，而无需单击它。

<ul class="nav navbar-nav">
            <li class="dropdown" id="search-btn-js">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="search-cars">Search Cars <span class="caret"></span></a>
                <ul class="dropdown-menu"></ul>
            </li>
</ul>

我已经尝试在点击按钮时将'open'类附加到search-btn-js元素，这对于此版本的Bootstrap无效并且由于某种原因

$('#search-btn-js').trigger('click.bs.dropdown');

不起作用。有人会以编程方式打开这个子菜单吗？提前谢谢！

Answer 1

事实证明这是一个问题，列表项目，＆＃39;打开＆＃39;如果没有看到，那么这个课程就会被定位。因此，如果#nav在技术上仍处于隐藏状态（应该看起来很明显），那么.addClass将无法工作。为了解决这个问题，您只需要包含这个：

$('#nav').on('shown.bs.collapse', function () {
    $('#search-btn-js').addClass('open');
    console.log('open that damn menu');
  });

因此，只有在点击按钮时显示#nav时，才应用课程＆＃39;打开＆＃39;。将上述代码放入您的条件中，您应该没问题。

单击按钮时，在Bootstraps移动导航栏上打开子菜单

1 个答案: