解決jQuery插件tipswindown與hintbox沖突
更新時(shí)間：2010年11月05日 22:16:55 作者：
先掃下盲：tipswindown是jQuery的彈窗插件，可以使用url或當(dāng)前頁(yè)元素顯示在模擬層中；hintbox是jQuery的類(lèi)似Google Suggestions插件。
使用情形如下：
頁(yè)面a.aspx中點(diǎn)擊按鈕彈出模擬層，在這個(gè)層中有一個(gè)輸入文本框“監(jiān)督人”處調(diào)用hintbox來(lái)產(chǎn)生即時(shí)查詢(xún)功能。
$("#windown-content").ajaxStart(function(){
$(this).html("<img src='"+templateSrc+"/images/loading.gif' class='loading' />");
});
將其改為：
$("#windown-content").html("<img src='"+templateSrc+"/images/loading.gif' class='loading' />");
原因是兩個(gè)插件即使是在不同情形下觸發(fā)ajax事件，使用的仍是同一對(duì)象，即jQuery.js中出現(xiàn)的
ajaxSetup: function( settings ) {
jQuery.extend( jQuery.ajaxSettings, settings );
},
ajaxSettings: {
url: location.href,
global: true,
type: "GET",
contentType: "application/x-www-form-urlencoded",
processData: true,
async: true,
/*
timeout: 0,
data: null,
username: null,
password: null,
*/
// Create the request object; Microsoft failed to properly
// implement the XMLHttpRequest in IE7, so we use the ActiveXObject when it is available
// This function can be overriden by calling jQuery.ajaxSetup
xhr:function(){
return window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
},
accepts: {
xml: "application/xml, text/xml",
html: "text/html",
script: "text/javascript, application/javascript",
json: "application/json, text/javascript",
text: "text/plain",
_default: "*/*"
}
},
這樣在當(dāng)前窗體中就會(huì)是只有一個(gè)xhr對(duì)象存在，因?yàn)樵趆intbox中的ajax事件會(huì)觸發(fā)tipswindown的ajaxStart事件。
可下載修改過(guò)后的tipswindown，點(diǎn)擊下載。
頁(yè)面a.aspx中點(diǎn)擊按鈕彈出模擬層，在這個(gè)層中有一個(gè)輸入文本框“監(jiān)督人”處調(diào)用hintbox來(lái)產(chǎn)生即時(shí)查詢(xún)功能。
直接調(diào)用產(chǎn)生了如下情形：
于是找到j(luò)query.hintbox-1.3.js這個(gè)文件，發(fā)現(xiàn)其中出現(xiàn)這么一行：
復(fù)制代碼 代碼如下:
$("#windown-content").ajaxStart(function(){
$(this).html("<img src='"+templateSrc+"/images/loading.gif' class='loading' />");
});
將其改為：
復(fù)制代碼 代碼如下:
$("#windown-content").html("<img src='"+templateSrc+"/images/loading.gif' class='loading' />");
原因是兩個(gè)插件即使是在不同情形下觸發(fā)ajax事件，使用的仍是同一對(duì)象，即jQuery.js中出現(xiàn)的
復(fù)制代碼 代碼如下:
ajaxSetup: function( settings ) {
jQuery.extend( jQuery.ajaxSettings, settings );
},
ajaxSettings: {
url: location.href,
global: true,
type: "GET",
contentType: "application/x-www-form-urlencoded",
processData: true,
async: true,
/*
timeout: 0,
data: null,
username: null,
password: null,
*/
// Create the request object; Microsoft failed to properly
// implement the XMLHttpRequest in IE7, so we use the ActiveXObject when it is available
// This function can be overriden by calling jQuery.ajaxSetup
xhr:function(){
return window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
},
accepts: {
xml: "application/xml, text/xml",
html: "text/html",
script: "text/javascript, application/javascript",
json: "application/json, text/javascript",
text: "text/plain",
_default: "*/*"
}
},
這樣在當(dāng)前窗體中就會(huì)是只有一個(gè)xhr對(duì)象存在，因?yàn)樵趆intbox中的ajax事件會(huì)觸發(fā)tipswindown的ajaxStart事件。
可下載修改過(guò)后的tipswindown，點(diǎn)擊下載。
您可能感興趣的文章:
- 解決jquery版本沖突的有效方法
- jQuery多個(gè)版本和其他js庫(kù)沖突的解決方法
- jquery插件沖突(jquery.noconflict)解決方法分享
- 解決jquery插件沖突的問(wèn)題
- jQuery中 $ 符號(hào)的沖突問(wèn)題及解決方案
- bootstrap與Jquery UI 按鈕樣式?jīng)_突的解決辦法
- 關(guān)于兩個(gè)jQuery(js)特效沖突的bug的解決辦法
- 完美解決jQuery符號(hào)$與其他javascript 庫(kù)、框架沖突的問(wèn)題
- 避免jQuery名字沖突 noConflict()方法
- jQuery解決$符號(hào)命名沖突
- jQuery $命名沖突解決方案匯總
- jQuery插件版本沖突的處理方法分析
相關(guān)文章
基于jquery日歷價(jià)格、庫(kù)存等設(shè)置插件
這篇文章主要為大家詳細(xì)介紹了基于jquery日歷價(jià)格、庫(kù)存等設(shè)置插件，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
分享jQuery的3種常見(jiàn)事件監(jiān)聽(tīng)方式
這篇文章主要介紹了jQuery常見(jiàn)事件的監(jiān)聽(tīng)方式，頁(yè)面經(jīng)常會(huì)有各種事件發(fā)生，事件發(fā)生后需要進(jìn)行一些特定處理，即執(zhí)行特定的函數(shù)或者語(yǔ)句。這就需要對(duì)事件進(jìn)行監(jiān)聽(tīng)，下面關(guān)于監(jiān)聽(tīng)事件的介紹，需要的小伙伴可以參考一下2022-03-03
jQuery EasyUI API 中文文檔 - ComboGrid 組合表格
jQuery EasyUI API 中文文檔 - ComboGrid 組合表格,需要的朋友可以參考下。2011-10-10
jQuery給指定的table動(dòng)態(tài)添加刪除行的操作方法
今天在項(xiàng)目中，剛好用到給指定的table添加一行、刪除一行。添加一行，支持在任意行添加一行且可配置的，刪除一行支持動(dòng)態(tài)刪除一行。本文給大家介紹的非常詳細(xì)，一起看看吧2016-10-10
HTML5+jQuery插件Quicksand實(shí)現(xiàn)超酷的星際爭(zhēng)霸2兵種分類(lèi)展示效果(附demo源碼下載)
這篇文章主要介紹了HTML5+jQuery插件Quicksand實(shí)現(xiàn)超酷的星際爭(zhēng)霸2兵種分類(lèi)展示效果,詳細(xì)分析了Quicksand插件的使用及圖片浮動(dòng)顯示的實(shí)現(xiàn)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2016-05-05
jQuery將所有被選中的checkbox某個(gè)屬性值連接成字符串的方法
這篇文章主要介紹了jQuery將所有被選中的checkbox某個(gè)屬性值連接成字符串的方法,可實(shí)現(xiàn)將選中屬性值連接成字符串的功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01
本篇文章主要介紹了基于jQuery的左滑出現(xiàn)刪除按鈕的示例，這里整理了詳細(xì)的代碼,非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-08-08
使用jQuery的ajax功能實(shí)現(xiàn)的RSS Reader 代碼
Rss閱讀器挺不錯(cuò)的。我覺(jué)得如果在igoogle或是dropthings這種形式的portal下來(lái)放很多RSS模塊顯示自己每天需要關(guān)注的信息那將會(huì)減少大家很多的打開(kāi)瀏覽器和輸入網(wǎng)址的時(shí)間。2009-09-09
加載列表時(shí)jquery獲取ul中第一個(gè)li的屬性
通過(guò)jquery獲取ul中第一個(gè)li的屬性，當(dāng)加載列表時(shí)，默認(rèn)希望選中第一條，下面是具體的實(shí)現(xiàn)代碼2014-11-11
單選按鈕以及復(fù)選按鈕的使用情況還是蠻多的,多選按鈕使用toggleClass()方法就可以實(shí)現(xiàn)，下面小編給大家介紹單選按鈕的實(shí)現(xiàn)，感興趣的朋友一起看下吧2016-06-06