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 Plupload上传插件的使用
Apr 19 jQuery
jquery 禁止鼠标右键并监听右键事件
Apr 27 jQuery
JQuery EasyUI的一些常用组件
Jul 12 jQuery
利用JQuery操作iframe父页面、子页面的元素和方法汇总
Sep 10 jQuery
jQuery+vue.js实现的九宫格拼图游戏完整实例【附源码下载】
Sep 12 jQuery
jquery实现楼层滚动效果
Jan 01 jQuery
使用Ajax和Jquery配合数据库实现下拉框的二级联动的示例
Jan 25 jQuery
jQuery中内容过滤器简单用法示例
Mar 31 jQuery
jQuery操作attr、prop、val()/text()/html()、class属性
May 23 jQuery
jQuery表单选择器用法详解
Aug 22 jQuery
jQuery 判断元素是否存在然后按需加载内容的实现代码
Jan 16 jQuery
jQuery实现手风琴特效
Jan 11 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
Win2003+apache+PHP+SqlServer2008 配置生产环境
2014/07/29 PHP
PHP生成不重复随机数的方法汇总
2014/11/19 PHP
PDO::commit讲解
2019/01/27 PHP
PHP ElasticSearch做搜索实例讲解
2020/02/05 PHP
js 数值项目的格式化函数代码
2010/05/14 Javascript
javascript限制文本框只允许输入数字(曾经与现在的方法对比)
2013/01/18 Javascript
根据IP的地址,区分不同的地区,查看不同的网站页面的js代码
2013/02/26 Javascript
window.returnValue使用方法示例介绍
2014/07/03 Javascript
JavaScript实现大数的运算
2014/11/24 Javascript
深入理解JavaScript中的浮点数
2016/05/18 Javascript
js实现九宫格的随机颜色跳转
2017/02/19 Javascript
js 输入框 正则表达式(菜鸟必看教程)
2017/02/19 Javascript
node.js中EJS 模板快速入门教程
2017/05/08 Javascript
JavaScript判断浏览器和hack滚动条的写法
2017/07/23 Javascript
jQuery实现高级检索功能
2019/05/28 jQuery
koa2+vue实现登陆及登录状态判断
2019/08/15 Javascript
vue.js实现左边导航切换右边内容
2019/10/21 Javascript
vue中实现高德定位功能
2019/12/03 Javascript
JS函数本身的作用域实例分析
2020/03/16 Javascript
详解vue中在父组件点击按钮触发子组件的事件
2020/11/13 Javascript
代码块高亮可复制显示js插件highlight.js+clipboard.js整合
2021/02/15 Javascript
python实现360皮肤按钮控件示例
2014/02/21 Python
python导出chrome书签到markdown文件的实例代码
2017/12/27 Python
利用Python产生加密表和解密表的实现方法
2019/10/15 Python
python如何求数组连续最大和的示例代码
2020/02/04 Python
Python引入多个模块及包的概念过程解析
2020/09/21 Python
Python pip 常用命令汇总
2020/10/19 Python
Java面试题:说出如下代码的执行结果
2015/10/30 面试题
百度吧主申请感言
2014/01/12 职场文书
档案接收函
2014/01/13 职场文书
个人承诺书怎么写
2014/05/24 职场文书
2014中考励志标语
2014/06/05 职场文书
项目合作意向书模板
2014/07/29 职场文书
民主评议党员自我评议范文2014
2014/09/26 职场文书
2015年工程部工作总结
2015/04/30 职场文书
Ajax常用封装库——Axios的使用
2021/05/08 Javascript