Bootstrap 3.0.3：下拉菜单 - 在移动设备上无法点击的项目

Question

在我的website下拉菜单中的链接无法在移动设备（Android和iOS）上运行。这意味着当我点击桌面上的菜单项时，它工作正常，当我点击iPod touch上的相同项目时，它只关闭下拉列表并且什么也不做。父项运作良好。

例如：当我按下'Activiteiten'然后按'Wandelroute'时，手机上没有任何动静。当我以320px的宽度（就像移动设备的宽度）绘制我的窗口（在桌面上）时，菜单才有效。我怀疑我的代码是导致问题还是移动设备的问题。

到目前为止我尝试过：

• 我按正确的顺序放了jQuery和Bootstrap;
• 包含bootstrap-dropdown.js;

• 包含以下代码：

  .dropdown-背景 {position：static; }

然后还有其他奇怪的事情。在同一网站的this页面上，该菜单在移动设备上运行正常。我完全不知道该页面与其他页面有什么不同。

我正在使用Joomla 3.x，jQuery 1.11.1和Bootstrap 3.0.3。

Answer 1

我认为这可能与浏览器控制台中引发的错误有关，该错误来自此代码：

$('.dropdown-menu').on('touchstart.dropdown.data-api', (e) ->
    e.stopPropagation() )

您应该在模板文件夹的 index.php 中找到它。找到后，请更改为以下内容：

$('.dropdown-menu').on('touchstart.dropdown.data-api', function(e){
    e.stopPropagation();
});

希望这有帮助

Answer 2

发现我的错：我在我的网站上使用了一个＆＃39; Joomla＆＃39; -version of Bootstrap。该版本由Joomla-plugin程序员针对Joomla进行了优化。现在我使用旧版Bootstrap 3，我的菜单再次正常工作。