首次单击后引导下拉菜单仍然不起作用（link_to 版本）答案

【问题标题】：Bootstrap dropdown still doesn't work after first click (link_to version)首次单击后引导下拉菜单仍然不起作用（link_to 版本）
【发布时间】：2015-07-23 21:43:27
【问题描述】：

我看到有一个类似的帖子here，但它并没有完全回答我的问题版本。我还是 Rails 的新手，所以我知道这一定是逻辑背后的一个简单原因。

我不知道如何将 Bootstrap 与 rails 路由相适应；它不断在我的链接末尾添加一个#，但我不确定如何防止这种情况，但仍然启用下拉菜单。

<li class="dropdown">
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Conditions & Treatments <span class="caret"></span></a>
  <ul class="dropdown-menu">
    <li><%= link_to 'Achilles Tendinitis, Tendinosis', conditions_achilles_path %></li>
    <li><%= link_to 'Arthritis, Hallus Limitus, Hallux Rigidus', conditions_arthritis_path %></li>
  </ul>
</li>

如果有人能解释一下我确信这是一个很棒的简单逻辑，谢谢。

【问题讨论】：

除了#（你让我意识到我的应用程序上发生了同样奇怪的事情），你有什么问题吗？即使我有这个# 链接仍然有效
问题是当我单击下拉菜单时无法显示下拉菜单。如果它确实下拉，那么链接可能会起作用，但是在我第二次单击它后我什至无法让它下拉。
如果您使用的是 turbolinks，请将其禁用并重试。
也许问题比这更微妙。您是否将//= require bootstrap 包含到您的application.js 中？这将包括 Bootstrap 的 javascript 库，这是下拉菜单工作所必需的
@Loqman 的建议奏效了，谢谢！我不知道这是为什么？我需要阅读它，但还是谢谢你们！

标签： ruby-on-rails twitter-bootstrap

【解决方案1】：

Turbolink 可能会与您的应用程序的 javascript 的行为发生冲突，您可以自行修复它。使用您编写的代码很容易做到这一点，但是当问题出在第三方库或插件中时，识别和解决冲突会变得更加令人沮丧。

这些冲突的一些常见原因包括：

初始化绑定到 DOM Ready 事件
初始化代码加载外部脚本并将元素附加到文档的head
在window 对象上使用全局变量。

Turbolinks 鼓励您将 JavaScript 放在 <head> 中，这样每次替换 <body> 时都不会执行 JS。

您可以将 JS 放在页面底部，并且仍然可以让您的代码正常工作。代码必须清理页面的先前状态，重新初始化，而不是总是依赖document.ready。例如启用工具提示：

// Cleanup + enable Bootstrap tooltips on jQuery's ready event as well as
// Turbolinks's page change event.
$(document).on("ready page:change", function() {
  $("[data-toggle='tooltip']")
    .tooltip("destroy")
    .tooltip();
});

【讨论】：