如何解決多個Ajax請求執(zhí)行返回先后的問題

這篇文章主要講解了“如何解決多個Ajax請求執(zhí)行返回先后的問題”,文中的講解內(nèi)容簡單清晰,易于學(xué)習(xí)與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學(xué)習(xí)“如何解決多個Ajax請求執(zhí)行返回先后的問題”吧!

成都創(chuàng)新互聯(lián)致力于互聯(lián)網(wǎng)品牌建設(shè)與網(wǎng)絡(luò)營銷,包括成都網(wǎng)站制作、網(wǎng)站設(shè)計、SEO優(yōu)化、網(wǎng)絡(luò)推廣、整站優(yōu)化營銷策劃推廣、電子商務(wù)、移動互聯(lián)網(wǎng)營銷等。成都創(chuàng)新互聯(lián)為不同類型的客戶提供良好的互聯(lián)網(wǎng)應(yīng)用定制及解決方案,成都創(chuàng)新互聯(lián)核心團隊十余年專注互聯(lián)網(wǎng)開發(fā),積累了豐富的網(wǎng)站經(jīng)驗,為廣大企業(yè)客戶提供一站式企業(yè)網(wǎng)站建設(shè)服務(wù),在網(wǎng)站建設(shè)行業(yè)內(nèi)樹立了良好口碑。

有時候在一個業(yè)務(wù)事件處理流程上,可能會遇到點擊了一個按鈕或者其他事件觸發(fā)了一個動作

需要執(zhí)行兩個以上的Ajax請求,但是可能要顧慮到Ajax請求執(zhí)行的先后順序,有時候Ajax請求順序出問題,會導(dǎo)致各種問題

例如現(xiàn)在有兩個ajax事件,分別為ajax1 ,ajax2

一個叫做main的方法調(diào)用執(zhí)行入口

1.

function main(){
ajax1(data,callback);
ajax2(data,callback);
}

如果我們按照上面的方法去執(zhí)行,表面上看似乎是讓ajax1先執(zhí)行,ajax2后執(zhí)行。如果不仔細想,有些人會認為ajax1先執(zhí)行完,之后才會執(zhí)行ajax2.事實上真的會如此嗎?

答案是 不一定 。當(dāng)然對于有多個ajax請求對執(zhí)行返回順序沒要求的情況,我們不需要過多考慮誰先執(zhí)行,誰先返回的
那要是考慮ajax事件執(zhí)行先后順序以及返回順序呢

要是這樣那怎么解決ajax事件的執(zhí)行返回先后順序呢

當(dāng)然現(xiàn)在你應(yīng)該會想到ajax回調(diào)函數(shù),Good,這是一個好主意
現(xiàn)在按這種思路改變一下方法,方法如下

function main(){
ajax1( data , ajax2( ) );
}

這樣看起來,你是不是覺得Very Good呢?真的嗎?真的是Very Good嗎?

Maybe,But in some case ,這樣寫可能有些不方便,當(dāng)然也許你可能不會遇到,但是我遇到了一種比較特殊的情況
比如下面這種可能

function main(){
aa(data);
ajax1(data,callback);
}

function aa(val){
var data=val+"";//這里是對傳入數(shù)據(jù)進行修改,封裝,當(dāng)然這里是隨便寫的
ajax2(data,ajax2Callback);
}

function ajax2Callback(){
console.log("=====回調(diào)函數(shù)ajax2Callback()執(zhí)行========");
console.log("=====這里正在執(zhí)行ajax執(zhí)行完畢后必須執(zhí)行的操作========");
}

你認為這種情況可以滿足ajax2在ajax1先執(zhí)行并且先執(zhí)行完畢嗎

仔細想想你會發(fā)現(xiàn)得到答案

No!
Now ,How to solve this proplem . How to make sure ajax2 finished before ajax1 .

當(dāng)然,你可能會說,這不簡單,把ajax1的調(diào)用放進ajax2方法回調(diào)方法ajax2Callback的最后面

不得不承認這是一種解決方案,但是如果是一個很古老的項目,已經(jīng)做了好幾年的項目了。里面調(diào)用復(fù)雜,要盡量去避免修改以前的底層方法,也許你為了修改這個bug,就這樣簡單解決了,你可能又會創(chuàng)造多個bug.

那到底還有沒有好的方法去解決了?

Sure,solve it easy .但是工作經(jīng)驗不足的人很少會一下想到,只會用前面的辦法草草解決問題,不管三七二十一。

而我采用了一種比較笨的方法,而且還存在一定問題,使用了setTimeOut定時器執(zhí)行一次,但是問題想必大家都知道,誰知道這個Ajax會執(zhí)行多久了,還好有大神指導(dǎo)了下我,
還記得對數(shù)組排序嗎,說道這個,也許你會好奇,這與數(shù)組排序有啥關(guān)系。下面會告訴你答案

代碼說明一切:

function main(){
var temp=ajax2Callback;
ajax2Callback=function(){
temp();
ajax1(data,callback);
}
aa(data);
ajax2Callback=temp; 
}

function aa(val){
var data=val+"";//這里是對傳入數(shù)據(jù)進行修改,封裝,當(dāng)然這里是隨便寫的
ajax2(data,ajax2Callback);
}

function ajax2Callback(){
console.log("=====回調(diào)函數(shù)ajax2Callback()執(zhí)行========");
console.log("=====這里正在執(zhí)行ajax執(zhí)行完畢后必須執(zhí)行的操作========");
}

看出來沒,是不是很有趣,沒有修改最低層的方法,僅僅修改了main方法,是不是很像數(shù)組排序里的當(dāng)我們比較兩個值大小時,不管你用冒泡排序,還是快速排序,是不是都設(shè)置了一個臨時變量去存儲值。當(dāng)然排序比較大小時,你可以沒必要設(shè)置臨時變量,僅僅用一個^運算符去做賦值比大小,甚至你可以偷懶到直接調(diào)用系統(tǒng)的Arrays.sort()方法,當(dāng)然這都可以

function changeSearchContactType(obj)
{
if (!obj)
{
return;
}

var contactType = obj.value;

var origRenderTemplate = renderTemplate;
renderTemplate = function(data)
{
origRenderTemplate(data);
ajaxAnywhere.submitAJAX('setSearchContactType');
}
var result = TemplateHelper.changeSearchContactTemplate(contactType, contactUIUID);
renderTemplate = origRenderTemplate;
return result;
}

感謝各位的閱讀,以上就是“如何解決多個Ajax請求執(zhí)行返回先后的問題”的內(nèi)容了,經(jīng)過本文的學(xué)習(xí)后,相信大家對如何解決多個Ajax請求執(zhí)行返回先后的問題這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是創(chuàng)新互聯(lián),小編將為大家推送更多相關(guān)知識點的文章,歡迎關(guān)注!

名稱欄目:如何解決多個Ajax請求執(zhí)行返回先后的問題
網(wǎng)站地址:http://muchs.cn/article32/gecgsc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供移動網(wǎng)站建設(shè)、網(wǎng)站導(dǎo)航ChatGPT、網(wǎng)站制作、標簽優(yōu)化、搜索引擎優(yōu)化

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)