Javascript 使用引导的Rails 4应用程序中的JQuery冲突

我已经在使用Bootstrap3的Rails4.1.8应用程序中添加了几个JQuery函数。这些功能用于解决将“活动”样式应用于当前导航选项卡的问题

这些函数可以很好地删除活动类并将其应用于单击的选项卡，这非常好。问题是选项卡不再作为链接使用。悬停时，目标地址将显示在浏览器对话框中。但当点击时，什么也没发生。控制台中甚至没有事件。甚至不会抛出错误。不过颜色会变

活动菜单项目.js

$(document).ready(function() {
    $('li>a.tab_link').click(function(e) {
      $('li>a.tab_link').removeClass('active');
      var $this = $(this);
      if (!$this.hasClass('active')) {
        $this.addClass('active');
      }
      e.preventDefault();
    });
});

$(document).ready(function() {
    $('.nav-pills li a.btn').click(function(e) {
      $('.nav-pills li a.btn').removeClass('active');
      var $this = $(this);
      if (!$this.hasClass('active')) {
        $this.addClass('active');
      }
      e.preventDefault();
    });
});

//
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require turbolinks
//= require bootstrap-sprockets
//= require change_theme
//= require active_menu_item
//= require_self
//= require_tree .

来自application.html.erb标签..

<!-- Load javascripts -->
<%= javascript_include_tag 'application', 'data-turbolinks-track' => false %>

Gemfile

source 'https://rubygems.org'

gem 'rails', '4.1.8'
gem 'mysql2'
gem 'sass-rails', '~> 5.0.3'
gem 'compass', '~> 1.0.0'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.0.0'
gem 'kaminari'
gem 'therubyracer',  platforms: :ruby
gem 'jquery-rails'
gem 'turbolinks'
gem 'jquery-turbolinks'
gem 'jbuilder', '~> 2.0'
gem 'sdoc', '~> 0.4.0',          group: :doc
gem 'spring',        group: :development
gem 'fabrication', '~> 2.12.2'
gem 'ffaker'
gem 'forgery'
gem 'rufus-scheduler', '~> 3.1.1'
gem "activeuuid"
gem 'foreigner', '~> 1.7.2'
gem 'aws-sdk', '~> 2.0.24'
group :development do
  gem 'rails-erd', '~> 1.3.0'
end
gem 'bootstrap-sass', '~> 3.2.0'
gem 'autoprefixer-rails'
gem 'bootstrap_form'
gem 'puma', '~> 2.11.1'
gem 'devise'

尝试删除

e.preventDefault（）行，但它根本不起作用。我还尝试在application.html.erb中将TurboLinks设置为“false”，并删除application.js以及TurboLinks Gem和Jquery TurboLinks Gem中的TurboLinks引用，但没有任何效果。它还坏了很多其他东西，所以我把它放回去了

我很确定这是我如何编写函数的问题。我的JQuery非常糟糕（仍在学习中），我或多或少会找到函数并修改它们以满足我的需要。我真的不明白我是否正确加载了JQuery。我想我有点希望Rails gems能为我做到这一点

我对JQuery知之甚少，在问这个问题之前已经进行了广泛的搜索。我知道这些函数的目标是正确的，因为它们会改变颜色并一直保持到我单击其他东西为止。唯一的问题是，一旦点击，链接将被完全禁用。如果需要任何其他代码来找到解决方案，我很乐意发布它

编辑：做了一个演示。然而，它没有显示实际的问题-链接将改变颜色，但不再作为链接工作

请帮忙

谢谢
链接不起作用的原因是您在回调中指定了
e.preventDefault（）
。看一看（这里）[了解更多信息

如果在回调中删除该行，您将看到链接现在可以正常工作，但发生了其他意外情况-颜色将短暂改变（由于应用了
活动的
类）但是当页面重新呈现时，返回到正常状态。这是因为当click处理程序立即被调用并添加类时，Turbolinks会用响应替换整个主体

我建议不要使用jQuery，而是依赖
当前页面？
帮助程序来确定是否应该应用该类

<li class="<%= 'active' if current_page?(about_path) %>"><%= link_to "About", about_path %></li>



希望这有帮助。
当您删除
e.preventDefault（）时
在回调中，链接是否工作但颜色不变，或者什么都不起作用？@BartJedrocha当我删除该行时，链接工作并且颜色也会发生变化。但是，它只会在一瞬间改变颜色。一旦链接呈现其目标，颜色变化就消失了。这修复了所有问题！非常感谢。我真的希望有这样的效果作为使用jQuery方式的一种方法，但我不想完全删除Turbolink。不过我喜欢这种方法，因为它感觉更“Railsy”：）@B.Bulpett从TurboLinks 3开始，您可以将DOM的部分指定为永久性的，这意味着它们不会由于Turbolink请求而重新呈现。请参阅