为什么 jQuery 没有加载到我的 Rails 3.2.3 应用程序中？答案

【问题标题】：Why is jQuery not loading in my Rails 3.2.3 app?为什么 jQuery 没有加载到我的 Rails 3.2.3 应用程序中？
【发布时间】：2015-06-22 13:07:50
【问题描述】：

直到昨天，jQuery 在我的 Rails 应用程序中加载得还不错。我正在尝试安装调试器/ruby-debug gem。正如您可能知道的那样，Rails 3 中的调试器 gem 存在问题，并且我未能成功安装依赖项，因此我从 Gemfile 中删除了 gem。从那以后加载我的网站时，jQuery 没有加载。这些是我在控制台中看到的消息：

assets/jquery_ujs.js?body=1:377Uncaught ReferenceError: jQuery is not defined
bootstrap-transition.js:24Uncaught TypeError: undefined is not a function
bootstrap.js:3Uncaught ReferenceError: jQuery is not defined
welcome:210Uncaught ReferenceError: $ is not defined

这是我的 application.js 文件：

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require_tree .

如果我在 layouts/application.html.erb 中显式加载 jQuery，就像这样，它可以工作：

<%= javascript_include_tag "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" %>
<%= javascript_include_tag "application" %>

有什么想法可以解决这个问题并再次加载 jQuery 吗？查看 .rvm/gems/ruby-1.9.3-p125/gems/jquery-rails-2.0.2/vendor/assets/javascripts 我可以看到 jquery.js 和 jquery.min.js 仍然存在。

【问题讨论】：

您的 gemfile 中还有 gem 'jquery-rails' 行吗？
当然可以。甚至成功安装了“jquery-rails”。
您是否尝试将 jquery 库放在 app/assets/javascripts 文件夹中？
没有。我以前从来没有这样做过。据我所知，jQuery 包含在一个新的 Rails 应用程序中。无论如何，这基本上就是我在上面的 sn-p 中所做的，但我使用的是 CDN 而不是本地库。显然，对于生产，我也会使用本地库作为回退，但这只是一个测试。
您的 JS 文件一定有某种冲突。尝试重新排序你的树，看看是否会有所不同。

标签： jquery ruby-on-rails ruby-on-rails-3

【解决方案1】：

感谢@Djj。重新排序我的 application.js 树似乎已经解决了这个问题。这是我修改后的树：

//= require jquery_ujs
//= require jquery
//= require twitter/bootstrap
//= require jquery.placeholder
//= require_tree .

【讨论】：

【解决方案2】：

在我的情况下，问题是由于异步加载 javascript 文件造成的。

<%= javascript_include_tag "application", :async => true %>

切换回

<%= javascript_include_tag "application" %>

解决了这个问题。

【讨论】：

这也为我修复了它。不过，我想利用异步，知道它为什么会导致问题吗？

【解决方案3】：

经过很长时间，这解决了我的错误问题。

确保 Jquery 只加载一次。

在 Gemfile 中包含 gem 'jquery-rails' 并执行 $ bundle install

确保将这些包含在app/assets/javascripts/application.js 文件中。

//= require jquery
//= require jquery_ujs

// require jquery 等错误时的语法导致无法加载 jquery。

如果所有内容都包含正确，则您的 html 文件的页面源代码必须显示包含的所有源文件。

对我来说，我遇到了一个问题，因为除了在 app/assets/javascript 下的 application.js 文件中需要它之外，我还在 app/views/layouts 下的 application.html.erb 中明确加载了来自 google 的 jquery 插件源。这会导致 jquery 被再次定义，并且会弹出一些错误，例如 placeholder() not defined、oApi not defined for null。

【讨论】：