Question

我有一个Meteor 1.8.1应用程序，该应用程序使用Bootstrap 3.3.7中的Dropdown。我的导航栏上有以下html

    <ul class="nav navbar-nav" id="headerNav">
      <li class="active">
        <a href="/liveView">
          <div class="icon-wrapper">
            <span class="glyphicon glyphicon-home" aria-hidden="true"></span>
          </div>
          Live&nbsp;View
        </a></li>
      <li class="">
        <a href="/broadcast">
          <div class="icon-wrapper">
            <span class="glyphicon glyphicon-bullhorn" aria-hidden="true"></span>
          </div>
          Broadcast
        </a></li>
      <li><a class="btnSwitchPlace" href="/">
          <div class="icon-wrapper">
            <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>
            <span class="badge">1</span>
          </div>
          <span>Channels</span>
        </a></li>
      <li class="user-menu dropdown">
        <a id="display-name-link" href="#user-menu" class="dropdown-toggle" data-toggle="dropdown" role="button"
          aria-haspopup="true" aria-expanded="false">
          <span class="icon-wrapper">
            <i class="glyphicon glyphicon-user"></i>
          </span>
          {{displayName}}<span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
          <li><a class="btnAgencyInfo" href="/agency">Agency</a></li>
          <li><a href="/create">Create Channel</a></li>
          <li class="divider"></li>
          <li><a href="/logout">Sign out</a></li>
        </ul>
      </li>
    </ul>

在除IE（已在IE11上测试）之外的所有浏览器上，按预期打开下拉列表。在IE上，浏览器重定向到www.url.com/#user-menu

如果我从控制台$('display-name-link').trigger('click')执行，则会打开下拉列表，并且不会触发错误。

Answer 1

{{displayName}}导致组件重新呈现，因为它首先返回“未登录”，然后在执行登录后返回实际名称。这会导致引导程序无法重新加载处理下拉列表的事件，并且锚标记会像往常一样执行。

修复该问题只是在e.preventDefault点击事件处理程序上添加一个display-name-link。

$('#display-name-link').click(function(e){
  e.preventDefault()
})

IE 11引导程序下拉列表在单击时重定向，而不是打开它

1 个答案: