rails 和 bootstrap:未捕获的 ReferenceError:未定义 jQuery

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/22948181/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 02:08:10  来源:igfitidea点击:

rails and bootstrap: Uncaught ReferenceError: jQuery is not defined

jqueryruby-on-railstwitter-bootstrap

提问by AgostinoX

I created a simple webapp integrating bootstrap 3 in a rails 3.2.17 application, following thisprocedure found on stackoverflow, so without using a gem but manually copying the bootstrap files in the relevant app directories.

我创建了一个简单的 webapp,在 rails 3.2.17 应用程序中集成了 bootstrap 3,遵循在 stackoverflow 上找到的这个过程,所以没有使用 gem,而是手动复制相关应用程序目录中的 bootstrap 文件。

Even if i have, in my gem file:

即使我有,在我的 gem 文件中:

gem 'jquery-rails'

i can still see, inspecting my web page with chrome, the error:

我仍然可以看到,用 chrome 检查我的网页,错误:

Uncaught ReferenceError: jQuery is not defined 

My page is a "normal" html page in public directory. Maybe it doesn't "inherit" all the assets stuff? The code is like this:

我的页面是公共目录中的“普通”html 页面。也许它没有“继承”所有资产?代码是这样的:

<!DOCTYPE html>
<html>
<head>
    <title>Bootsrap Test 01</title>
    <link rel="stylesheet" href="/css/bootstrap.css">
    <script src="/js/bootstrap.min.js" type="text/javascript"></script>
</head>

...

I've not yet tried but i guess that javascript based feature won't work.

我还没有尝试过,但我想基于 javascript 的功能将不起作用。

回答by Kirti Thorat

Assuming that after adding gem 'jquery-rails', you have ran bundle installcommand.

假设在添加之后gem 'jquery-rails',您已经运行了bundle install命令。

Make sure you have following in app/assets/javascripts/application.js

确保你有以下内容 app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap.min   // Add it after jquery and jquery_ujs

EDIT

编辑

You will need to explicitly include jQuery before including /bootstrap.min.js. For example :

您需要在包含之前显式包含 jQuery /bootstrap.min.js。例如 :

<!DOCTYPE html>
<html>
<head>
    <title>Bootsrap Test 01</title>
    <link rel="stylesheet" href="/css/bootstrap.css">
    <script src="/assets/jquery.js" type="text/javascript"></script>
    <script src="/assets/jquery_ujs.js" type="text/javascript"></script>
    <script src="/js/bootstrap.min.js" type="text/javascript"></script>
</head>

回答by Serge Seletskyy

Even if you have set jquery correctly you can still see that issue when you inline javascript code is evoked before jQuery is initialized.

即使您正确设置了 jquery,当您在 jQuery 初始化之前调用内联 javascript 代码时,您仍然可以看到该问题。

You can wrap your javascript code in

您可以将您的 javascript 代码包装在

document.addEventListener("DOMContentLoaded", function(event) { 
  //do work with $
});

Or refactor your code to not use inline javascript :)

或重构您的代码以不使用内联 javascript :)

回答by mpalencia

on 'application.js' of rails 5.0.1 the default is

在 Rails 5.0.1 的“application.js”上,默认是

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

change it to

将其更改为

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

*load first jquery before bootstrap

*在引导之前加载第一个jquery

回答by ConorB

Another place to check is the <head>of the application.html.erbfile.

要检查的另一个地方是<head>在的application.html.erb文件。

Be sure that you're loading in jQuery before the Bootstrap javascript.

确保在 Bootstrap javascript 之前加载 jQuery。

回答by kai_onthereal

I came across the same error message in the console.

我在控制台中遇到了相同的错误消息。

Just make sure jQuery is above Bootstrap in your 'assets/javascripts/application.js' file

只需确保 jQuery 位于“assets/javascripts/application.js”文件中的 Bootstrap 之上

Solution:

解决方案:

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require bootstrap