用于 Bootstrap 下拉菜单的 JavaScript 有时有效，有时无效答案

【问题标题】：JavaScript for Bootstrap dropdown sometimes works, sometimes doesn't用于 Bootstrap 下拉菜单的 JavaScript 有时有效，有时无效
【发布时间】：2015-07-28 01:56:55
【问题描述】：

所以我像这样使用 Bootstrap 下拉菜单：

%ul.hidden-xs.hidden-sm
  %li= link_to "LIBRARY", library_path
  %li= link_to "PRICING", plans_and_pricing_path
  %li.dropdown
    .dropdown-toggle{"aria-expanded" => "false", "aria-haspopup" => "true", "data-toggle" => "dropdown"}= link_to "#{current_user.first_name} <i class='fa fa-caret-down'></i>".html_safe, '#'
    %ul.dropdown-menu
      %li= link_to 'Edit profile', edit_user_registration_path(resource), class: 'user-nav-li'
      %li= link_to 'Referrals', referrals_path, class: 'user-nav-li'
  %li= link_to "LOG OUT", destroy_user_session_path, method: :delete

有时有效，有时无效。我尝试在单击下拉列表时查看检查器中的元素（在它不起作用的时候），我可以看到事件触发。 %li.dropdown 应该添加了 open 类，aria-expanded 应该从 true 更改为 false。这就是它工作时发生的情况。但是，当它不起作用时，元素保持不变，只是在检查器 (Chrome) 中简单地突出显示，就像元素被更改时所做的那样。

这告诉我 JS 正在加载，因为它至少响应了点击事件。但没有其他事情发生。

我尝试过寻找模式。刷新有时会修复它，但有时会触发问题。有时导航到不同的页面会修复它，但有时不会。并且没有一个页面表现一致。我想这应该没关系，因为它在我的导航栏中，并且在应用程序级别。

我不确定还可以尝试什么。一切似乎都很随意。

旁注：我不是 JavaScript 专家

【问题讨论】：

turbolinks 可能会困扰您。安装gem 'jquery-turbolinks'并检查。
这可能对你有帮助github.com/twbs/bootstrap-sass/issues/714
你是我的英雄，@Pavan。 jquery-turbolinks 解决了我的问题，以及我使用一些令人不安的解决方法的其他一些问题:)
太棒了！我将其添加为答案:)
感谢您的链接，@rob。阅读在 css/js 文件中使用不同方式要求/导入引导程序和链轮的影响非常有趣。以后可以帮我省些麻烦。

标签： javascript jquery ruby-on-rails twitter-bootstrap haml

【解决方案1】：

正如我所说，罪魁祸首是turbolinks。添加 gem jquery-turbolinks 应该可以解决问题。

#Gemfile
gem 'jquery-turbolinks'

然后运行bundle install

【讨论】：