Bootstrap导航栏下拉链接在Safari中不起作用

问题描述:

简而言之:有没有人设法让Bootstrap下拉导航链接在Safari(任何用户代理)中工作?我查看了至少五个类似的线程,但没有一个标准修复程序适用于我的情况。Bootstrap导航栏下拉链接在Safari中不起作用

Chrome/Firefox中的一切都很好,但在Safari(桌面和移动设备)中单击链接时没有任何反应。我正在使用流星。

HTML:

<ul class="nav navbar-nav navbar-right">  
<li class="dropdown"> 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{selectedItem}}<span class="caret"></span></a> 

    <ul id="selectItem" class="dropdown-menu nav navbar-nav navbar-right"> 
      <li><a id="abc" href="#">ABC</a></li> 
      <li><a id="def" href="#">DEF</a></li> 
      <li><a id="ghi" href="#">GHI</a></li>                 
    </ul> 
</li> 

JS:

Template.navigation.events({ 
    'click #selectItem': function(){ 
    var selectedItem = document.activeElement.getAttribute("id"); 
    Session.set('selectedItem', selectedItem); 
    } 
}); 
+0

可能会添加一个非常高的z值? –

+0

谢谢,我试过了。 Safari仍认识到发生了点击 - 它只是不注册activeElement值(将其记录为空)。 –

好了,我已经找到了一种解决方法。这适用于所有浏览器:

Template.navigation.events({ 
    'click #selectedItem': function(e){ 
    var selectedItem = e.target.id; 
    Session.set('selectedItem', selectedItem); 
    } 
});