教你如何終止JQUERY的$.AJAX請求

更新時間：2016年02月23日 11:36:22 投稿：hebedich

本文給大家分享的是使用abort來終止JQUERY的$.AJAX請求的方法和示例，有需要的小伙伴可以參考下

最近遇到，如果用戶頻繁點擊ajax請求，有兩個問題：

1，如果連續(xù)點擊了5個ajax請求，前4個其實是無效的，趁早結(jié)束節(jié)省資源。

2，更嚴(yán)重的問題是：最后一個發(fā)送的請求，響應(yīng)未必是最后一個，有可能造成混亂。還需要一個隊列來維護(hù)發(fā)送的請求和響應(yīng)。

我其實已經(jīng)設(shè)計好了該隊列的實現(xiàn)方式，后來發(fā)現(xiàn)jQuery直接通過abort方法，這樣就不需要那么復(fù)雜的實現(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();

上面這段代碼其于兩個知識點：

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實現(xiàn) secondTry 在等待一秒之后將firstTry的ajax終止：
var firstTry = $.ajax(
 //do something
 );
var secondTry = setTimeout(function(){alert(‘ok');firstTry.abort()},1000);

您可能感興趣的文章: