Question

我的网站顶部有一个Bootstrap下拉导航栏。

当我单击页面其他位置的链接时，我试图显示“ helpDropDownMenuLink”下拉菜单。

请有人可以帮我吗？我已经在Bootstrap文档中阅读了有关$（）。dropdown（'toggle'）的信息，但是无法使其正常工作..！

非常感谢

<nav class="navbar">
    <div class="container-fluid">
        <div id="navbarCollapse" class="collapse navbar-collapse">
            <ul class="navbar-nav mx-auto">
                <li class="nav-item">
                    <a id="helpDropdownMenuLink" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="nav-link">Help<i class="fa fa-angle-down"></i></a>
                    <div aria-labelledby="helpDropdownMenuLink" class="dropdown-menu dropdown-menu-right">
                        <a href="/link1" class="dropdown-item">Link 1</a>
                        <a href="/link2" class="dropdown-item">Link 2</a>
                    </div>
                </li>
                <li class="nav-item">
                    <a href="/about" class="nav-link">About</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

Answer 1

我想这就是您所需要的：JSFiddle

html

<button class="btn btn-secondary trigger_button">Trigger dropdown</button><br><br>
<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown">
    Dropdown
  </button>
  <div class="dropdown-menu">
    Stuff...
  </div>
</div>

js

$('.trigger_button').click(function(e){
  e.stopPropagation();
  $('.dropdown-toggle').dropdown('toggle');
});

在页面其他地方激活Bootstrap 4下拉菜单

1 个答案: