jQuery無(wú)沖突模式詳解
解決沖突的方法:
在jQuery中解決沖突的方法是noConflict()方法,這個(gè)方法將$標(biāo)識(shí)符的控制權(quán)返回給其他JavaScript庫(kù)
如以下示例中的jQuery代碼將在將jQuery加載到頁(yè)面后立即將其置于無(wú)沖突模式,并分配新的變量名稱$j以替換$別名,以避免與原型框架沖突。詳細(xì)代碼如下:
// 為jQuery定義新的名字 var $j = jQuery.noConflict(); $j(document).ready(function(){ // 單擊demo時(shí)彈出對(duì)話框 $j("#demo").click(function(){ alert("這是jQuery的新定義"); }); }); //原型框架代碼 document.observe("dom:loaded", function(){ // 點(diǎn)擊demo1顯示彈出框 $(demo1).observe('click', function(event){ alert("原型與jQuery一起正常運(yùn)行"); }); });
效果圖如下:
但是,如果不想為jQuery定義另一個(gè)快捷方式不想修改現(xiàn)有的jQuery代碼或者是覺得$在jQuery中節(jié)省了不少時(shí)間而且易于使用,那么我們可以使用另一種方法來(lái)代替
我們可以將$作為參數(shù)傳遞給jQuery(document).ready()函數(shù)
// 為jQuery定義新的名字 jQuery.noConflict(); jQuery(document).ready(function($){ // The dollar sign in here work as an alias to jQuery $("#demo").click(function(){ alert("jQuery正在正常工作"); }); }); document.observe("dom:loaded", function(){ $(demo1).observe('click', function(event){ alert("jQuery與原型一起正常使用"); }); });
效果圖:
注意:
避免沖突的上述解決方案依賴于在加載prototype.js之后加載jQuery。但是如果在其他庫(kù)之前包含jQuery,則可以在jQuery代碼中使用全名,以避免沖突而不調(diào)用jQuery.noConflict()。但在這種情況下,$將具有在其他庫(kù)中定義的含義
總結(jié):以上就是本篇文章的全部?jī)?nèi)容了,希望對(duì)大家有所幫助
相關(guān)文章
jQuery簡(jiǎn)單實(shí)現(xiàn)上下,左右滑動(dòng)的方法
這篇文章主要介紹了jQuery簡(jiǎn)單實(shí)現(xiàn)上下,左右滑動(dòng)的方法,涉及jQuery動(dòng)態(tài)操作頁(yè)面元素的相關(guān)技巧,需要的朋友可以參考下2016-06-06jQuery EasyUI API 中文文檔 - ProgressBar 進(jìn)度條
jQuery EasyUI API 中文文檔 - ProgressBar 進(jìn)度條,使用jQuery EasyUI的朋友可以參考下。2011-09-09使用jQuery實(shí)現(xiàn)圖片遮罩半透明墜落遮擋
這篇文章主要介紹了使用jQuery實(shí)現(xiàn)圖片遮罩半透明墜落遮擋,效果非常棒,小伙伴們做相冊(cè)的時(shí)候可以直接拿走使用。2015-03-03