最近為了要使用兩種Library的功能,卻因互相衝突而頭痛
解決之後來分享一下心得~
[more]
jQuery與Prototype的Framework不需做更改
我們要更改的目標為執行jQuery的程式碼
首先,在程式碼最前面加上『 jQuery.noConflict(); 』
接著使用『 jQuery(document).ready(function($){ 原程式碼 }); 』包夾原程式碼
如此一來,jQuery就會使用 jQuery 代替 $ 作為處理時的變數
實作(example)
原碼(before)
$(document).ready(function(){ $("a#fb").fancybox({ 'opacity': true, 'transitionIn':'elastic', 'transitionOut': 'elastic', });
修改後(after)
jQuery.noConflict(); jQuery(document).ready(function($) { $("a#fb").fancybox({ 'opacity': true, 'transitionIn':'elastic', 'transitionOut': 'elastic', }); });
JS載入順序
先設定讓 jQuery 與其 程式碼 先行載入
實作(example)
<script type="text/javascript" src="jQuery.js"></script>(jQuery 框架)
<script type="text/javascript" src="jQuery_code.js"></script>(jQuery 程式碼)
要先讓jQuery載入完
<script type="text/javascript" src="Prototype.js"></script>(Prototype 框架)
<script type="text/javascript" src="Prototype_code.js"></script>(Prototype 程式碼)
留言