檢測Ajax是否完成

Question

首先，我從json文件中獲取一些郵政編碼。之後，通過郵政編碼加載完成，我回路上與郵政編碼的foreach郵政編碼連接到

http://api.geonames.org/postalCodeSearchJSON?postalcode="+zip+"&maxRows=1&username=demo

和替換「拉鍊」。因此，如果我有30個郵政編碼，它會將此URL調用30次，併爲每個郵政編碼獲取緯度和經度，並將它們放入數組中。

問題是，我想在我的數組被ajax調用完全構建之前使用它。我正在做的工作是做一個setTimeout（）3秒鐘，以便瀏覽器有時間完全構建數組，然後我可以使用它。

我目前使用

$.getJSON("zip-codes.json", function(){}).done(function(locations){ 
    // this .done() isnt actually working 
}); 

下面是我的代碼：

var marker_object = new Array; 
// get location zip codes 
$.getJSON("zip-codes.json", function(){}).done(function(locations){ 

    // for each zip code 
    $(locations.nodes).each(function(i, location_value){ 
     var name = location_value.node.city+', '+location_value.node.state+'\n'+location_value.node.phone; 
     var zip = location_value.node.zip; 
     // if zip is not empty 
     if(zip != ''){ 

      // get lat, long for each zip 
      $.getJSON("http://api.geonames.org/postalCodeSearchJSON?postalcode="+zip+"&maxRows=1&username=midnetmedia", function(){}).done(function(long_lat){ 
       // loop thru each zip code, even tho we only return 1 value at a time 
       $(long_lat.postalCodes).each(function(k,long_lat_value){ 
        marker_object.push({latLng: [long_lat_value.lat, long_lat_value.lng], name: name}); 
       }); 
      }); // get lat, long for each zip 

     } // if not empty 
    }) // foreach location 

}); // get zip codes 

setTimeout(function(){ 
    console.log(marker_object); 
}, 3000); 

爲 「marker_object」 最終的結果看起來是這樣的，當它終於建成了

marker_object = [ 
    {latLng: [34.079351, -117.455114], name: 'City 1'}, 
    {latLng: [24.079351, -67.455114], name: 'City 2'}, 
    {latLng: [14.079351, -36.455114], name: 'City 3'}, 
    ... 
] 

如何知道我的$ .getJSON實際完成時的情況？因爲.done（）不適合我。我應該使用$ .AJAX（）來代替嗎？

Answer 1

使用.ajaxComplete()事件。

$(document).ajaxComplete(function(event, xhr, settings) { 
    alert("Ajax Complete") 
}); 

按照其文檔，

每當一個Ajax請求完成後，jQuery的觸發事件ajaxComplete。任何和所有已經使用.ajaxComplete（）方法註冊的處理程序都會在此時執行。

Answer 2

好的，現在我明白你的問題了。你想知道何時全部 30個電話已完成。這很簡單，只需使用$.when和.then即可傳遞.getJson調用返回的所有承諾。

所以，你可以嘗試這樣的事：

var myDeferreds = []; 
$(locations.nodes).each(function(i, location_value){ 
    var name = location_value.node.city+', '+location_value.node.state+'\n'+location_value.node.phone; 
    var zip = location_value.node.zip; 
    // if zip is not empty 
    if(zip != ''){ 

     // get lat, long for each zip 
     myDeferreds.push($.getJSON("http://api.geonames.org/postalCodeSearchJSON?postalcode="+zip+"&maxRows=1&username=midnetmedia", function(long_lat){ 
      // loop thru each zip code, even tho we only return 1 value at a time 
      $(long_lat.postalCodes).each(function(k,long_lat_value){ 
       marker_object.push({latLng: [long_lat_value.lat, long_lat_value.lng], name: name}); 
      })); 
     }); // get lat, long for each zip 

    } // if not empty 
}) // foreach location 

$.when(myDeferreds).then(function() { 
    console.log("All my ajax calls are complete!!!"); 
}); 

Answer 3

既然你想看看當所有的Ajax調用完成後（不只是當他們中的一個做），你可以比較的數已完成的請求總數有多少，當這些計數相等時，您將知道您的陣列已滿，您可以使用它。你可以做這樣的事情：

var marker_object = []; 
// get location zip codes 
$.getJSON("http://localhost/hiab/zip-codes.json").done(function(locations){ 

    // for each zip code 
    var nodes = $(locations.nodes); 
    var cnt = 0; 
    nodes.each(function(i, location_value){ 
     var name = location_value.node.city+', '+location_value.node.state+'\n'+location_value.node.phone; 
     var zip = location_value.node.zip; 
     // if zip is not empty 
     if(zip != ''){ 

      // get lat, long for each zip 
      $.getJSON("http://api.geonames.org/postalCodeSearchJSON?postalcode="+zip+"&maxRows=1&username=midnetmedia").done(function(long_lat){ 
       // loop thru each zip code, even tho we only return 1 value at a time 
       $(long_lat.postalCodes).each(function(k,long_lat_value){ 
        marker_object.push({latLng: [long_lat_value.lat, long_lat_value.lng], name: name}); 
       }); 
       // see if all marker nodes are now in the array 
       if (++cnt === nodes.length) { 
        // process marker_object array now 
       } 
      }); // get lat, long for each zip 

     } // if not empty 
    }) // foreach location 

}); // get zip codes 

而且，就沒有必要當你使用.done()傳遞一個空的成功的功能。您可以忽略該參數，並且ajax函數將會看到該參數不存在。