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编写textarea输入字数限制代码
Mar 23 jQuery
jQuery实现鼠标经过显示动画边框特效
Mar 24 jQuery
jQuery实现鼠标滑过预览图片大图效果的方法
Apr 26 jQuery
jquery插件canvaspercent.js实现百分比圆饼效果
Jul 18 jQuery
用jquery获取select标签中选中的option值及文本的示例
Jan 25 jQuery
jQuery 改变P标签文本值方法
Feb 24 jQuery
jQuery实现仿京东防抖动菜单效果示例
Jul 06 jQuery
jquery实现搜索框功能实例详解
Jul 23 jQuery
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
jQuery操作attr、prop、val()/text()/html()、class属性
May 23 jQuery
jquery 键盘事件 keypress() keydown() keyup()用法总结
Oct 23 jQuery
jQuery+ajax实现文件上传功能
Dec 22 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
php中的一个中文字符串截取函数
2007/02/14 PHP
php将会员数据导入到ucenter的代码
2010/07/18 PHP
PHP类的声明与实例化及构造方法与析构方法详解
2016/01/26 PHP
PHP的swoole扩展安装方法详细教程
2016/05/18 PHP
百度留言本js 大家可以参考下
2009/10/13 Javascript
小议Javascript中的this指针
2010/03/18 Javascript
Jquery知识点一 Jquery的ready和Dom的onload的区别
2011/01/15 Javascript
jquery 选择器引擎sizzle浅析
2013/02/06 Javascript
JavaScript自定义事件介绍
2013/08/29 Javascript
jQuery实现的多选框多级联动插件
2014/05/02 Javascript
jq实现左侧显示图片右侧文字滑动切换效果
2015/08/04 Javascript
Angular Js文件上传之form-data
2015/08/28 Javascript
快速学习jQuery插件 Form表单插件使用方法
2015/12/01 Javascript
javascript数据类型验证方法
2015/12/31 Javascript
BootStrap实现手机端轮播图左右滑动事件
2016/10/13 Javascript
JavaScript中清空数组的三种方式
2017/03/22 Javascript
微信小程序 JS动态修改样式的实现方法
2018/12/16 Javascript
vue动态添加路由addRoutes之不能将动态路由存入缓存的解决
2019/02/19 Javascript
JS使用栈判断给定字符串是否是回文算法示例
2019/03/04 Javascript
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
2020/02/01 jQuery
Java多线程编程中ThreadLocal类的用法及深入
2016/06/21 Python
基于Python Numpy的数组array和矩阵matrix详解
2018/04/04 Python
Python处理菜单消息操作示例【基于win32ui模块】
2018/05/09 Python
网红编程语言Python将纳入高考你怎么看?
2018/06/07 Python
PHP统计代码行数的小代码
2019/09/19 Python
Python 网络编程之TCP客户端/服务端功能示例【基于socket套接字】
2019/10/12 Python
Django-imagekit的使用详解
2020/07/06 Python
北美Newegg打造的全球尖货海购平台:tt海购
2018/09/28 全球购物
YOOX台湾:意大利奢侈品电商
2018/10/13 全球购物
SQL面试题
2013/04/30 面试题
实习教师自我鉴定
2013/12/09 职场文书
遗失说明具结保证书
2015/02/26 职场文书
早恋主题班会
2015/08/14 职场文书
小学英语教师研修感悟
2015/11/18 职场文书
Python爬虫框架之Scrapy中Spider的用法
2021/06/28 Python
Java+swing实现抖音上的表白程序详解
2022/06/25 Java/Android