我试图使用Bootstrap使一个程序的接口。我添加了jQuery 1.11.0到<head>标签,并认为这是,但当我在浏览器中启动网页jQuery报告一个错误:
Uncaught Error: Bootstrap's JavaScript requires jQuery
我已经尝试使用jQuery 1.9.0,我已经尝试在几个cdn上托管副本,但我不能让它工作。有人能指出我做错了什么吗?
我试图使用Bootstrap使一个程序的接口。我添加了jQuery 1.11.0到<head>标签,并认为这是,但当我在浏览器中启动网页jQuery报告一个错误:
Uncaught Error: Bootstrap's JavaScript requires jQuery
我已经尝试使用jQuery 1.9.0,我已经尝试在几个cdn上托管副本,但我不能让它工作。有人能指出我做错了什么吗?
当前回答
我正在使用NodeJS,得到了同样的错误。和其他答案一样,这个问题也是因为在Bootstrap之前需要加载JQuery;然而,由于NodeJS的特性,这个更改必须应用在pipeline.js文件中。
在pipeline.js中的变化是这样的:
var jsFilesToInject = [
// Dependencies like jQuery, or Angular are brought in here
'js/dependencies/angular.1.3.js',
'js/dependencies/jquery.js',
'js/dependencies/bootstrap.js',
'js/dependencies/**/*.js',
];
我还使用grunt来帮助,它自动改变了主html页面的顺序:
<!--SCRIPTS-->
<script src="/js/dependencies/angular.1.3.js"></script>
<script src="/js/dependencies/jquery.js"></script>
<script src="/js/dependencies/bootstrap.js"></script>
<!-- other dependencies -->
<!--SCRIPTS END-->
希望能有所帮助!你没有说你的环境是什么,所以我决定发布这个答案。
其他回答
以上的方法我几乎都试过了。
最后通过包含
script src="{%static 'App/js/jquery.js' %}"
在base.html中加载staticfiles后,即{% load staticfiles %}
在我看来,这个解决方案真的很愚蠢,也很奇怪。
下面的代码由_Layout预填充。cshtml文件。(不是我写的)
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
但是,当我在Scripts文件夹中验证时,jquery-1.10.2.min.js甚至不可用。因此,替换如下所示的代码,其中jquery-1.9.1.min.js是一个现有文件:
<script src="~/Scripts/jquery-1.9.1.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
你为JAVASCRIPT和BOOTSTRAP提供了错误的顺序
按照惯例,bootstrap必须遵循jquery文件定义
<!-- JQuery Core JavaScript -->
<script src="lib/js/jquery.min.js"></script>
<script src="lib/js/jquery-ui.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="lib/js/bootstrap.min.js"></script>
我正在使用NodeJS,得到了同样的错误。和其他答案一样,这个问题也是因为在Bootstrap之前需要加载JQuery;然而,由于NodeJS的特性,这个更改必须应用在pipeline.js文件中。
在pipeline.js中的变化是这样的:
var jsFilesToInject = [
// Dependencies like jQuery, or Angular are brought in here
'js/dependencies/angular.1.3.js',
'js/dependencies/jquery.js',
'js/dependencies/bootstrap.js',
'js/dependencies/**/*.js',
];
我还使用grunt来帮助,它自动改变了主html页面的顺序:
<!--SCRIPTS-->
<script src="/js/dependencies/angular.1.3.js"></script>
<script src="/js/dependencies/jquery.js"></script>
<script src="/js/dependencies/bootstrap.js"></script>
<!-- other dependencies -->
<!--SCRIPTS END-->
希望能有所帮助!你没有说你的环境是什么,所以我决定发布这个答案。
如果你在一个只有浏览器的环境中,使用SridharR的解决方案。
如果你是在Node/CommonJS +浏览器环境(例如electron, Node -webkit等);这个错误的原因是jQuery的导出逻辑首先检查模块,而不是窗口:
if (typeof module === "object" && typeof module.exports === "object") {
// CommonJS/Node
} else {
// window
}
注意,它通过module导出自己。这里是出口;所以jQuery和$没有被分配给window。
所以要解决这个问题,<script src="path/to/jquery.js"></script>;
你自己用require语句赋值就可以了:
<script>
window.jQuery = window.$ = require('jquery');
</script>
注意:如果你的电子应用程序不需要nodeIntegration,将其设置为false,这样你就不需要这个解决方法了。