Question

我有一堆下拉菜单，我有一个附加到文档的点击监听器。当我单击下拉锚点时，单击事件不会触发。

经过一番挖掘后，因为bootstrap阻止了传播。它在下面的JSbin中进行了演示

$(document).on('click', function(e){ console.log('Click triggered'); });

http://jsbin.com/lununufaqa/edit?html,js,console,output

无论如何要克服这个？

Answer 1

Replace your menu.component.html with below and this will start working.

<div class="dropdown" *ngFor='let menu of menuItem; let i = index'>
    <button class="dropdown-toggle" data-toggle="dropdown" *ngIf="menu" [attr.data-target]="'#navbarmobile'+ i" (click)="do()">{{menu.name}}</button>
    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>
</div>

Get more info from https://getbootstrap.com/docs/4.0/components/dropdowns/

Bootstrap下拉列表 - 仅在第一次单击时单击事件触发器

1 个答案: