jQuery 未定义 twitter bootstrap
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19502838/
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
jQuery is not defined twitter bootstrap
提问by Liondancer
I am getting this error that says jQuery is not defined. I want to use twitter bootstrap and jQuery-UI. In my <head>I've added the CSS and JS necessary. I noticed that the jQuery-UI page uses 1.9.1 jQuery and the latest version is 1.10.2. So I'm assuming there is some sort of conflict going on. Twitter bootstrap requires jQuery so that might be causing the error. Or perhaps I am doing something wrong.
我收到此错误，指出未定义 jQuery。我想使用 twitter bootstrap 和 jQuery-UI。在我的<head>我已经添加了必要的 CSS 和 JS。我注意到 jQuery-UI 页面使用 1.9.1 jQuery，最新版本是 1.10.2。所以我假设存在某种冲突。Twitter 引导程序需要 jQuery，因此可能会导致错误。或者也许我做错了什么。
Head:
头：
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
Error:
错误：
Uncaught ReferenceError: jQuery is not defined bootstrap.min.js:6
(anonymous function) bootstrap.min.js:6
回答by tymeJV
Load jQuery before everything else!
在其他一切之前加载 jQuery！
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
回答by Rodrigo
This is most likely because of 2 reasons:
这很可能是因为两个原因：
- You are loading jQuery twice; remove one of them (preferably the older version).
- You are loading bootstrap.min.js before loading jQuery (read the documentation here).
- 您正在加载 jQuery 两次；删除其中之一（最好是旧版本）。
- 您在加载 jQuery 之前加载 bootstrap.min.js（阅读此处的文档）。
What you need to do is:
你需要做的是：
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" />
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js" />
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" />
回答by Krishna
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
add jquery js file above bootstrap
在引导程序上方添加 jquery js 文件
回答by Dev Enthusiast
I've tested this and this order seems to work the best.
我已经测试过这个，这个顺序似乎效果最好。
- Load CSS
- Load jQuery
- Load Bootstrap
- Load jQuery UI
- 加载 CSS
- 加载 jQuery
- 加载引导程序
- 加载 jQuery UI
