Bootstrap 3 iPad下拉不起作用

我有一个简单的Bootstrap 3下拉菜单,可以在我testing过的所有浏览器(Chrome,FF,IE,Chrome上的Android)上运行,但是它不适用于Safari或iPad上的Chrome(ios 7.04)。

我认为这是一个与ontouchstart的问题,正如其他一些处理Bootstrap 2的post所build议的,但是我用本地文件试过了,并且没有成功: Bootstrap折叠的菜单链接无法在移动设备上使用

我也不想要一个解决scheme,我必须修改原来的JavaScript文件,因为我们目前正在从CDN拉。

我在这里创build了一个简单的代码片段来testing: http : //www.bootply.com/104124

我想到了。 我在我的锚标记中缺lesshref =“#”。 它在其他浏览器上工作正常,但不是在IOS上的铬或Safari浏览器。 现在工作正常。 以下是任何感兴趣的人的最终代码:

<div class="dropdown"> <a class="dropdown-toggle" id="ddAction" data-toggle="dropdown" href="#"> Action </a> <ul class="dropdown-menu" role="menu" aria-labelledby="ddaction"> <li role="presentation"> <a role="menuitem" tabindex="-1" href="http://www.google.com">Open Google</a> </li> </ul> </div> 

并在这里工作的示例: http : //www.bootply.com/104147

如果你不想使用<a>标签,或者添加一个冗余的href属性,你可以将cursor:pointer css应用到元素,它将工作

我们在iOS上testing的safari版本不能正确解释z-index的初始值。 在下拉菜单中增加z-index。 而不是点击该项目,它被隐藏,菜单closures。 为了使Safari工作,我们需要覆盖引导z-index:initial。

 .dropdown-menu { z-index: 25000 !important; } 

您也可以将一个类添加到名为clickable的标记中。 这是一个引导类。 它设置了css游标:指针。

 <a class="clickable"></a> 

我刚刚遇到了这个问题 – Bootstrap 3 navbar下拉菜单没有在iPad mini 2上打开(但在iPhone 7和各种桌面/笔记本电脑上工作)。 直接在iPad上进行debugging后,我发现问题是在js函数中使用“let”而不是“var”。 一旦我把“让我们”变成了“变种”,一切都很好。 只是想在这里添加这个以防万一(或删除一个类似的过时的function)certificate是别人的修复!