解決jquery版本沖突的有效方法
用過(guò)jQuery的朋友都知道jQuery不同版本會(huì)引發(fā)沖突,本文就此問(wèn)題提出有效的解決方案如下:
案例:解決jQuery1.3.2和1.4.2的沖突。(本例已測(cè)試通過(guò)!)
第一步:在1.4.2的源代碼的最后加上一句 :
var $j4 = jQuery.noConflict(true);
之所以在源碼這里加,而不是像大多數(shù)文章提的在要用到的時(shí)候加,這是因?yàn)楹芏嗷?.4.2的插件都要加,在這里加可以避免過(guò)多插件加這句代碼導(dǎo)致重復(fù)。這一句是將1.4.2的jQuery和$的引用權(quán)限全部放棄。也就是基于1.4.2的插件不能再用jQuery和$了。同時(shí)給予$j4的新的命名空間,注意它是window的屬性???.4.2的源代碼會(huì)發(fā)現(xiàn)它其實(shí)也就執(zhí)行了這兩句:
window.$=_$; window.jQuery=_jQuery;
道理同window.$=_temp$(返還命名空間)只是命名不同而已。
第二步:在基于1.4.2的框架的所有插件的頭部加上以下代碼:
var _temp$ = window.$,_tempjQuery = window.jQuery;
將jQuery1.3.2的$和jQuery放到臨時(shí)的變量空間上:
window.$ = $j4;
這句和下面的那句都是為了給中間的代碼能夠正確使用jQuery和$用的。后面的$j4是賦予他們正確的引用。
window.jQuery = $j4;
之所以要先放臨時(shí)變量存儲(chǔ),有三點(diǎn)必須這樣做的理由:
①.我們不希望改動(dòng)大量的jQuery插件源代碼,最好是不動(dòng),即使改的話,盡量改的少。而在頭部尾部加改動(dòng)代碼,中間的原始代碼不動(dòng)也是不錯(cuò)的一種方式。
②.因?yàn)?.4.2的已經(jīng)放棄了jQuery和$的控制權(quán),但是已有的插件代碼又用了他們來(lái)做引用,因?yàn)椴寮豢赡茴A(yù)知沖突,即使有沖突他人開(kāi)發(fā)的插件也一定要用$或者jQuery引用,除非它不是jQuery下的插件。
③.為了防止插件里面直接用window.$和window.jQuery進(jìn)行引用從而導(dǎo)致引用到1.3.2的jQuery和$,雖然這種情況比較少,但是以防萬(wàn)一。
中間的原始代碼不動(dòng),尾部加以下代碼:
window.$ = _temp$;//將$的引用權(quán)限返還給jQuery1.3. window.jQuery = _tempjQuery;//將jQuery的引用權(quán)限返還給jQuery1.3.
第三步:以后要用基于jQuery1.4.2的選取函數(shù)就只能用$j4(element)了。
總結(jié):到目前為止可行方案:jQuery1.4.2完全放棄$和jQuery的控制權(quán)限。1.3.2放棄$的控制權(quán)限但不放棄jQuery的權(quán)限,其實(shí)jQuery也可放棄,只不過(guò)要給個(gè)別名$j3。prototype最好放在jQuery1.3.2后面,它獲得$的控制權(quán)限。只是以后要用jQuery1.4.2就必須用$j4來(lái)引用了。但這樣即使有再多的jQuery框架版本沖突問(wèn)題,也全部解決掉了。假如來(lái)了個(gè)1.2的jQuery怎么辦,參照(2)的執(zhí)行步驟,只不過(guò)第一步改為:
var $j2 = jQuery.noConflict(true);
第三步用$j2(element)罷了。道理都是相同的。
相信本文所述對(duì)大家的jQuery程序設(shè)計(jì)有一定的借鑒價(jià)值。
相關(guān)文章
jquery.onoff實(shí)現(xiàn)簡(jiǎn)單的開(kāi)關(guān)按鈕功能(推薦)
這篇文章主要介紹了jquery.onoff實(shí)現(xiàn)簡(jiǎn)單的開(kāi)關(guān)按鈕功能,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-05-05
jQuery動(dòng)態(tài)添加元素后元素注冊(cè)事件失效解決
這篇文章主要介紹了jQuery動(dòng)態(tài)添加元素后元素注冊(cè)事件失效解決,文章圍繞主題展開(kāi)詳細(xì)的內(nèi)容介紹,具有一定的參考價(jià)值,需要的小伙伴可以參考一下2022-08-08
解決jquery中動(dòng)態(tài)新增的元素節(jié)點(diǎn)無(wú)法觸發(fā)事件問(wèn)題的兩種方法
這篇文章主要分享了解決jquery中動(dòng)態(tài)新增的元素節(jié)點(diǎn)無(wú)法觸發(fā)事件問(wèn)題的兩種方法,感興趣的小伙伴們可以參考一下2015-10-10
jQuery判斷多個(gè)input file 都不能為空的例子
這篇文章主要介紹了jQuery判斷多個(gè)input file 都不能為空的例子,即一次性判斷多個(gè)上傳文件選擇框不能為空的方法,需要的朋友可以參考下2015-06-06
jquery mobile移動(dòng)端幻燈片滑動(dòng)切換效果
這篇文章主要為大家詳細(xì)介紹了jquery mobile移動(dòng)端幻燈片滑動(dòng)切換效果,實(shí)現(xiàn)滑動(dòng)切換和點(diǎn)擊切換,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-01-01
基于jQuery模擬實(shí)現(xiàn)淘寶購(gòu)物車模塊
這篇文章主要介紹了如何利用jQuery+css+html模擬實(shí)現(xiàn)淘寶購(gòu)物車模塊,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起動(dòng)手嘗試一下2022-03-03
jquery使用$(element).is()來(lái)判斷獲取的tagName
這篇文章主要介紹了jquery使用$(element).is()來(lái)判斷獲取的tagName以及將取到標(biāo)簽用作到別的地方,需要的朋友可以參考下2014-08-08
jQuery實(shí)現(xiàn)的上拉刷新功能組件示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的上拉刷新功能組件,涉及jQuery事件響應(yīng)與頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2020-05-05

