Активация выпадающего меню Bootstrap 4 в другом месте на странице

Question

У меня есть панель навигации Bootstrap в верхней части моего сайта.

Я пытаюсь показать раскрывающийся список «helpDropDownMenuLink», когда нажимаю ссылку в другом месте на странице.

Пожалуйста, кто-нибудь может мне помочь?Я прочитал о $ (). Dropdown ('toggle') в документации по Bootstrap, но не смог заставить его работать ..!

Большое спасибо

<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');
});