bootstrap+jquery项目引入文件报错的解决方法


Posted in jQuery onJanuary 22, 2018

做一个项目的时候 ,控制台总是会出现各种bug,其实不用慌张,终结起来也就几种类型的错误,在开发中每次遇到错误都善于总结,下次在看到就会胸有成竹知道是什么情况了,以下是在开发过程中总结的一些错误以及错误的解决方法。

报错一:Uncaught ReferenceError: $ is not defined

Uncaught ReferenceError: $ is not defined
Uncaught ReferenceError: jQuery is not defined

bootstrap+jquery项目引入文件报错的解决方法 

错误原因:文件加载的顺序不对,jQuery文件的顺序要在前面

bootstrap+jquery项目引入文件报错的解决方法 

方法:把jQuery文件写在所有script文件前面

bootstrap+jquery项目引入文件报错的解决方法 

报错二:jsp页面相对路径和绝对路径的问题:

正常路径:html里面的../../,改成jsp页面就找不到路径了,这个时候成了这个鬼样子

bootstrap+jquery项目引入文件报错的解决方法 

这时候,只需要在文件里面加入这段代码:

bootstrap+jquery项目引入文件报错的解决方法 

解决办法:在<html>和<head>之间插入以下代码

<%
 String path = request.getRequestURI();
 String basePath = request.getScheme() + "://"
   + request.getServerName() + ":" + request.getServerPort()
   + path;
%>
<base href="<%=basePath%>" rel="external nofollow" >

报错三:Uncaught TypeError: $(...).tooltip is not a function

Uncaught TypeError: $(...).tooltip is not a function
 at HTMLDocument.<anonymous> (app.js:42)
 at l (jquery.min.js:4)
 at Object.fireWith [as resolveWith] (jquery.min.js:4)
 at Function.ready (jquery.min.js:4)
 at HTMLDocument.S (jquery.min.js:4)

bootstrap+jquery项目引入文件报错的解决方法 

原因:包括两个不同版本的jQuery UI。这可能会导致冲突。尝试删除

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

解决办法:

编辑:

<script>
jQuery( document ).ready(function( $ ) {
 $('.hasTooltip').tooltip();
});
</script>

像这样使用它,解决了我的问题!

报错四:Uncaught TypeError: $(...).sortable is not a function

Uncaught TypeError: $(...).sortable is not a function
 at HTMLDocument.<anonymous> (dashboard.js:12)
 at l (VM552 jquery.min.js:4)
 at Object.fireWith [as resolveWith] (VM552 jquery.min.js:4)
 at Function.ready (VM552 jquery.min.js:4)
 at HTMLDocument.S (VM552 jquery.min.js:4)

报错五:bootstrap.min.js:7 Uncaught Error: Bootstrap requires jQuery

bootstrap.min.js:7 Uncaught Error: Bootstrap requires jQuery
 at bootstrap.min.js:7

bootstrap+jquery项目引入文件报错的解决方法 

解决方案:解决方案:将jquery.min.js放在bootstrap.min.js文件之前引用,bootstrap.min.css文件在整两个文件前后引用都无妨(测试多次)。

总结

以上所述是小编给大家介绍的boostrap+jquery项目引入文件报错的解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery实现frame之间互通的方法
Jun 26 jQuery
利用jQuery异步上传文件的插件用法详解
Jul 19 jQuery
jQuery选择器之子元素选择器详解
Sep 18 jQuery
jQuery Dom元素操作技巧
Feb 04 jQuery
jQuery实现文件编码成base64并通过AJAX上传的方法
Apr 12 jQuery
jQuery实现条件搜索查询、实时取值及升降序排序的方法分析
May 04 jQuery
jQuery创建折叠式菜单
Jun 15 jQuery
jquery 遍历hash操作示例【基于ajax交互】
Oct 12 jQuery
jQuery实现的图片点击放大缩小功能案例
Jan 02 jQuery
jquery制作的移动端购物车效果完整示例
Feb 24 jQuery
jQuery实现容器间的元素拖拽功能
Dec 01 jQuery
jquery实现拖拽小方块效果
Dec 10 jQuery
jQuery获取所有父级元素及同级元素及子元素的方法(推荐)
Jan 21 #jQuery
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 #jQuery
基于jquery的on和click的区别详解
Jan 15 #jQuery
vue-cli webpack 引入jquery的方法
Jan 10 #jQuery
jQuery第一次运行页面默认触发点击事件的实例
Jan 10 #jQuery
Vue+jquery实现表格指定列的文字收缩的示例代码
Jan 09 #jQuery
如何快速解决JS或Jquery ajax异步跨域的问题
Jan 08 #jQuery
You might like
Laravel实现用户注册和登录
2015/01/23 PHP
WordPress的文章自动添加关键词及关键词的SEO优化
2016/03/01 PHP
php 删除指定文件夹的实例讲解
2017/07/25 PHP
PHP中使用CURL发送get/post请求上传图片批处理功能
2018/10/15 PHP
Javascript 检测键盘按键信息及键码值对应介绍
2013/01/03 Javascript
JQuery入门——用bind方法绑定事件处理函数应用介绍
2013/02/05 Javascript
jquery form表单序列化为对象的示例代码
2014/03/05 Javascript
深入理解JavaScript系列(40):设计模式之组合模式详解
2015/03/04 Javascript
浅谈JavaScript的Polymer框架中的behaviors对象
2015/07/29 Javascript
javascript中的try catch异常捕获机制用法分析
2016/12/14 Javascript
Vue render深入开发讲解
2018/04/13 Javascript
基于vue项目设置resolves.alias: '@'路径并适配webstorm
2020/12/02 Vue.js
Python中实现对list做减法操作介绍
2015/01/09 Python
python实现备份目录的方法
2015/08/03 Python
Python聚类算法之凝聚层次聚类实例分析
2015/11/20 Python
由浅入深讲解python中的yield与generator
2017/04/05 Python
python访问抓取网页常用命令总结
2017/04/11 Python
Win7下Python与Tensorflow-CPU版开发环境的安装与配置过程
2018/01/04 Python
python实现类之间的方法互相调用
2018/04/29 Python
Django项目中用JS实现加载子页面并传值的方法
2018/05/28 Python
对Python模块导入时全局变量__all__的作用详解
2019/01/11 Python
pycharm访问mysql数据库的方法步骤
2019/06/18 Python
python判断所输入的任意一个正整数是否为素数的两种方法
2019/06/27 Python
python实现切割url得到域名、协议、主机名等各个字段的例子
2019/07/25 Python
Python封装成可带参数的EXE安装包实例
2019/08/24 Python
台湾线上百货零售购物平台:friDay购物
2017/08/18 全球购物
Trench London官方网站:高级风衣和意大利皮夹克
2020/07/11 全球购物
就业推荐自我鉴定
2013/10/06 职场文书
地理科学专业自荐信
2014/09/01 职场文书
革命英雄事迹演讲稿
2014/09/13 职场文书
幼儿园小班教师个人工作总结
2015/02/06 职场文书
2015年党建工作总结
2015/03/30 职场文书
为什么中国式养孩子很累?
2019/08/07 职场文书
Python破解极验滑动验证码详细步骤
2021/05/21 Python
Python编程中Python与GIL互斥锁关系作用分析
2021/09/15 Python
Python中np.random.randint()参数详解及用法实例
2022/09/23 Python