-
現(xiàn)象
鼠標滑過列表發(fā)出請求是掰,在頁面上顯示請求結果。鼠標一次性滑過多個列表項辱匿,發(fā)出多個請求键痛,請求返回結果有時間查導致頁面顯示出現(xiàn)閃爍。
-
影響
頁面顯示閃爍匾七,視覺顯示不好看絮短,交互不友好
-
解決方法
-
取消之前的請求響應
在ajax請求未響應之前可以使用
xhr.abort()
取消,但如果發(fā)出的請求已經(jīng)到達了服務器昨忆,這種終止只是讓瀏覽器不在監(jiān)聽這個請求的響應丁频,服務器端仍然會進行處理。使用 abort() 取消后會進入 error 回調(diào)函數(shù)// 定義請求對象 var getCategoryInfoAjax = null; function getCategoryInfo() { if (getCategoryInfoAjax) { // 不為 null 說明之前請求過,需要取消請求 getCategoryInfoAjax.abort(); } getCategoryInfoAjax = $.ajax({ type: "POST", contentType: "application/x-www-form-urlencoded;charset=utf-8", url: url, data: param, success: function (result, testStatus) { // 也可以在這里判斷 ajax 請求是否存在來決定是否執(zhí)行回調(diào)函數(shù) }, complete: function (xhr, xs) { xhr = null; }, error: function (xmlHttpRequest, textStatus, errorThrown) { if (xmlHttpRequest.statusText === 'abort') { // 說明是主動中斷席里,不作出提示 } else { layer.msg('失敗'); } } }); }
缺點:使用封裝好的 ajax 方法叔磷,如果出現(xiàn)需要多個請求同時進行的情況,那么使用
abort()
取消請求會使其他請求終止奖磁。優(yōu)點:重復多次請求的情況下改基,我們可以拋棄之前所有的請求響應,獲得最后一次的請求響應咖为。
-
忽略之前的所有請求寥裂,保留最新一次的請求
創(chuàng)建計數(shù)器,利用閉包技術來判斷是否當前的ajax請求與響應返回是同一批次的案疲。
// 定義計數(shù)器 var xhrCount = 0; function getCategoryInfo() { var seqNum = ++xhrCount; getCategoryInfoAjax = $.ajax({ type: "POST", contentType: "application/x-www-form-urlencoded;charset=utf-8", url: url, data: param, success: function (result, testStatus) { if (seqNum === xhrCount) { // 請求和響應屬于同一批次的 } else { // 不相等說明請求和響應不是同一批次 } }, complete: function (xhr, xs) { xhr = null; }, error: function (xmlHttpRequest, textStatus, errorThrown) { layer.msg('失敗'); } }); }
-
Ajax 多次異步請求分析
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
- 文/潘曉璐 我一進店門褥赊,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人莉恼,你說我怎么就攤上這事拌喉。” “怎么了俐银?”我有些...
- 文/不壞的土叔 我叫張陵尿背,是天一觀的道長。 經(jīng)常有香客問我捶惜,道長田藐,這世上最難降的妖魔是什么? 我笑而不...
- 正文 為了忘掉前任吱七,我火速辦了婚禮汽久,結果婚禮上,老公的妹妹穿的比我還像新娘踊餐。我一直安慰自己景醇,他們只是感情好,可當我...
- 文/花漫 我一把揭開白布市袖。 她就那樣靜靜地躺著啡直,像睡著了一般烁涌。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上酒觅,一...
- 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼症概!你這毒婦竟也來了蕾额?” 一聲冷哼從身側(cè)響起,我...
- 正文 年R本政府宣布武翎,位于F島的核電站,受9級特大地震影響溶锭,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜符隙,卻給世界環(huán)境...
- 文/蒙蒙 一趴捅、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧霹疫,春花似錦拱绑、人聲如沸。這莊子的主人今日做“春日...
- 文/蒼蘭香墨 我抬頭看了看天上的太陽膀藐。三九已至,卻和暖如春红省,著一層夾襖步出監(jiān)牢的瞬間额各,已是汗流浹背。 一陣腳步聲響...
推薦閱讀更多精彩內(nèi)容
- 第一章 入門 基本功能:訪問和操作 dom 元素硬毕,控制頁面樣式,對頁面的事件處理礼仗,與ajax完美結合吐咳,有豐富的插件...
- Php代碼 收藏代碼 ajax通過 HTTP 請求加載遠程數(shù)據(jù)。jQuery 底層 AJAX 實現(xiàn)藐守。簡單易用的高...
- (重要知識點) 通過 HTTP 請求加載遠程數(shù)據(jù)挪丢。(優(yōu)點:比較方便使用) jQuery 底層 AJAX 實現(xiàn)。簡單...
- jQuery 發(fā)送的所有 Ajax 請求卢厂,內(nèi)部都會通過調(diào)用 $.ajax()函數(shù)來實現(xiàn)乾蓬。通常沒有必要直接調(diào)用這個函...
- $.ajax()方法參數(shù)詳解 1.url:要求為String類型的參數(shù),(默認為當前頁地址)發(fā)送請求的地址慎恒。 2....