为什么bootstrap下拉调用window.onfocus

Question

当我们点击bootstrap下拉链接时，会调用自定义集window.onfocus。

为什么Bootstrap调用window.onfocus方法？

<ul class="nav navbar-nav navbar-right">
  <li data-ng-show="userName" class="">
    <a href="javascript://" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">name<span class="caret"></span></a>
    <ul class="dropdown-menu" role="menu">
      <li><a href="#">Logout</a></li>
    </ul>
  </li>
</ul>

window.onfocus = function() {
  alert("window onfocus called");
}

JSFiddle Link

当我们点击菜单时，会显示警告信息。

Answer 1

因为Bootstrap在单击的下拉锚点上触发id事件。此事件自然会冒出DOM树，直到它到达窗口，并调用您的功能。

您可以使用focus

来阻止此操作

event.stopPropagation()

JSFiddle

Answer 2

Window.onfocus将自身绑定到窗口对象，并由所有焦点事件触发，因为它们会冒泡DOM树。单击下拉列表时的焦点事件与单击窗口时的焦点事件不同。查看this JSFiddle的控制台时可以看到这一点。

window.onfocus = function(e) {
  console.log(e);
}