教你如何終止JQUERY的$.AJAX請求
最近遇到,如果用戶頻繁點(diǎn)擊ajax請求,有兩個問題:
1,如果連續(xù)點(diǎn)擊了5個ajax請求,前4個其實(shí)是無效的,趁早結(jié)束節(jié)省資源。
2,更嚴(yán)重的問題是:最后一個發(fā)送的請求,響應(yīng)未必是最后一個,有可能造成混亂。還需要一個隊(duì)列來維護(hù)發(fā)送的請求和響應(yīng)。
我其實(shí)已經(jīng)設(shè)計(jì)好了該隊(duì)列的實(shí)現(xiàn)方式,后來發(fā)現(xiàn)jQuery直接通過abort方法,這樣就不需要那么復(fù)雜的實(shí)現(xiàn)了,畢竟還有其他事情等著完成。
用jquery發(fā)送ajax請求的確是太方便了,$.get、$.post、$.ajax等等,但我們有時候需要中途中止ajax請求。
舉個例子,用comet做聊天時,發(fā)送一個請求后,服務(wù)端通常過幾十秒后才會刷新鏈接、返回數(shù)據(jù)。假設(shè)服務(wù)端是30秒刷新一次鏈接,如果我們在10秒時想要停止這個ajax請求,怎么辦呢?
先上代碼,后面再解釋
var ajaxGet = $.get(“comet_server.php”,{id:1},function(data){ ….//一些操作 }); ajaxGet.abort();
上面這段代碼其于兩個知識點(diǎn):
1. $.get返回的數(shù)據(jù)類型是XMLHttpRequest,請參考手冊。($.post、$.ajax、$.getJSON、$.getScript也同樣)
2. XMLHttpRequest對象有abort()方法
注意:abort()后,ajax請求立即停止,但還是會執(zhí)行后面的function()。如果想避免執(zhí)行其中的操作,可以在function()開始位置加判斷
var ajaxGet = $.get(“comet_server.php”,{id:1},function(data){ if(data.length == 0) return true; ….//一些操作 }); ajaxGet.abort();
終止ajax請求:
var request = $.get(“ajax.aspx”,{id:1},function(data){ //do something }); //終止請求動作. request.abort();
防止重復(fù)請求:
var request; if(request != null) request.abort(); request = $.get(“ajax.aspx”,{id:1},function(){ //do something }); ajax & setTimeout實(shí)現(xiàn) secondTry 在等待一秒之后將firstTry的ajax終止: var firstTry = $.ajax( //do something ); var secondTry = setTimeout(function(){alert(‘ok');firstTry.abort()},1000);
- JQuery的Ajax請求實(shí)現(xiàn)局部刷新的簡單實(shí)例
- jquery的ajax異步請求接收返回json數(shù)據(jù)實(shí)例
- 跨域請求之jQuery的ajax jsonp的使用解惑
- jquery ajax請求方式與提示用戶正在處理請稍等
- 為jquery的ajax請求添加超時timeout時間的操作方法
- jQuery.ajax 跨域請求webapi設(shè)置headers的解決方案
- Jquery ajax請求導(dǎo)出Excel表格的實(shí)現(xiàn)代碼
- Jquery Ajax請求文件下載操作失敗的原因分析及解決辦法
- 淺析jQuery Ajax請求參數(shù)和返回數(shù)據(jù)的處理
- jQuery中ajax的相關(guān)知識點(diǎn)匯總
相關(guān)文章
jquery如何實(shí)現(xiàn)錨點(diǎn)鏈接之間的平滑滾動
實(shí)現(xiàn)錨點(diǎn)鏈接之間的平滑滾動的方法有很多,在接下來的文章中為大家介紹下,jquery是如何實(shí)現(xiàn)的,感興趣的朋友不要錯過2013-12-12jQuery實(shí)現(xiàn)鼠標(biāo)選文字發(fā)新浪微博的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)鼠標(biāo)選文字發(fā)新浪微博的方法,涉及jQuery鼠標(biāo)事件的響應(yīng)及新浪接口的調(diào)用技巧,非常簡單實(shí)用的功能,需要的朋友可以參考下2016-04-04簡單實(shí)現(xiàn)jQuery進(jìn)度條輪播實(shí)例代碼
這篇文章主要為大家詳細(xì)介紹了簡單實(shí)現(xiàn)jQuery進(jìn)度條輪播實(shí)例代碼,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-06-06JQuery中serialize()、serializeArray()和param()方法示例介紹
serialize()方法也是作用于一個JQuery對象,它能夠?qū)OM元素內(nèi)容序列化為字符串,serializeArray()方法不是返回字符串,而是將DOM元素序列化后,返回JSON格式的數(shù)據(jù)2014-07-07jquery ajax分頁插件的簡單實(shí)現(xiàn)
這篇文章主要介紹了jquery ajax分頁插件的簡單實(shí)現(xiàn)的相關(guān)資料,需要的朋友可以參考下2016-01-01jQuery實(shí)現(xiàn)checkbox的簡單操作
這篇文章主要介紹了jQuery實(shí)現(xiàn)checkbox的簡單操作,對復(fù)選框組的全選、全不選、不全選,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-11-11全面解析jQuery中的$(window)與$(document)的用法區(qū)別
這篇文章主要介紹了jQuery中的$(window)與$(document)的用法區(qū)別,具體內(nèi)容大家可查看下文的詳細(xì)講解,感興趣的小伙伴們可以參考一下。2017-08-08jQuery實(shí)現(xiàn)將div中滾動條滾動到指定位置的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)將div中滾動條滾動到指定位置的方法,涉及jQuery結(jié)合animate方法動態(tài)操作頁面元素屬性的相關(guān)技巧,需要的朋友可以參考下2016-08-08