bootstrap+jquery項目引入文件報錯的解決方法
做一個項目的時候 ,控制臺總是會出現(xiàn)各種bug,其實不用慌張,終結(jié)起來也就幾種類型的錯誤,在開發(fā)中每次遇到錯誤都善于總結(jié),下次在看到就會胸有成竹知道是什么情況了,以下是在開發(fā)過程中總結(jié)的一些錯誤以及錯誤的解決方法。
報錯一:Uncaught ReferenceError: $ is not defined
Uncaught ReferenceError: $ is not defined Uncaught ReferenceError: jQuery is not defined
錯誤原因:文件加載的順序不對,jQuery文件的順序要在前面
方法:把jQuery文件寫在所有script文件前面
報錯二:jsp頁面相對路徑和絕對路徑的問題:
正常路徑:html里面的../../,改成jsp頁面就找不到路徑了,這個時候成了這個鬼樣子
這時候,只需要在文件里面加入這段代碼:
解決辦法:在<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)
原因:包括兩個不同版本的jQuery UI。這可能會導(dǎo)致沖突。嘗試刪除
<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
解決方案:解決方案:將jquery.min.js放在bootstrap.min.js文件之前引用,bootstrap.min.css文件在整兩個文件前后引用都無妨(測試多次)。
總結(jié)
以上所述是小編給大家介紹的boostrap+jquery項目引入文件報錯的解決方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
- bootstrap+jQuery 實現(xiàn)下拉菜單中復(fù)選框全選和全不選效果
- vue中如何引入jQuery和Bootstrap
- Bootstrap jquery.twbsPagination.js動態(tài)頁碼分頁實例代碼
- bootstrap jquery dataTable 異步ajax刷新表格數(shù)據(jù)的實現(xiàn)方法
- Jquery與Bootstrap實現(xiàn)后臺管理頁面增刪改查功能示例
- Bootstrap select下拉聯(lián)動(jQuery cxselect)
- 通過BootStrap-select插件 js jQuery控制select屬性變化
- jquery插件bootstrapValidator表單驗證詳解
相關(guān)文章
jQuery實現(xiàn)響應(yīng)鼠標(biāo)背景變化的動態(tài)菜單效果代碼
這篇文章主要介紹了jQuery實現(xiàn)響應(yīng)鼠標(biāo)背景變化的動態(tài)菜單效果代碼,涉及jquery鼠標(biāo)mouseover事件操作頁面元素屬性的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08以WordPress為例講解jQuery美化頁面Title的方法
鼠標(biāo)移動到超鏈接時顯示Title提示即是所謂Title美化的一般手段,這里我們就以WordPress為例講解jQuery美化頁面Title的方法,需要的朋友可以參考下2016-05-05jquery+ajax實現(xiàn)上傳圖片并顯示上傳進(jìn)度功能【附php后臺接收】
這篇文章主要介紹了jquery+ajax實現(xiàn)上傳圖片并顯示上傳進(jìn)度功能,結(jié)合實例形式分析了jQuery+ajax結(jié)合layer.js插件與php后臺交互,實現(xiàn)顯示上傳進(jìn)度的相關(guān)操作技巧,需要的朋友可以參考下2019-06-06jquery移除button的inline onclick事件(已測試及兼容瀏覽器)
這種方法在Google Chrome下正常工作,但是在IE的兼容模式下會馬上調(diào)用reclick方法,這不是我們想要的效果;為了解決這個問題,我們可以換個思路,就是延遲綁定click事件2013-01-01jQuery實現(xiàn)懸浮在右上角的網(wǎng)頁客服效果代碼
這篇文章主要介紹了jQuery實現(xiàn)懸浮在右上角的網(wǎng)頁客服效果代碼,涉及jQuery響應(yīng)鼠標(biāo)事件動態(tài)變換頁面元素樣式的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-10-10JQuery限制復(fù)選框checkbox可選中個數(shù)的方法
這篇文章主要介紹了JQuery限制復(fù)選框checkbox可選中個數(shù)的方法,涉及jQuery操作復(fù)選框長度判斷與屬性修改的相關(guān)技巧,非常具有實用價值,需要的朋友可以參考下2015-04-04