Как создать событие, вызванное после завершения некоторых вызовов ajax?

Question

Пожалуйста, помогите мне создать подходящее событие для моей ситуации. Я считаю, что истинный путь сделать это без каких-либо счетчиков (например: How to know when all ajax calls are complete)

HTML:

<ul id="links"> 
    <li><a href="1.html">What is Yoda's first name?</a></li> 
    <li><a href="2.html">Why does Padme die?</a></li> 
    <li><a href="3.html">Who is Darth Rage?</a></li> 
</ul> 
<div id="content"></div> 

JQuery:

$('#links a').each(function (index, el) { 
    url = $(el).attr('href'); 
    $('<div class="article" />').appendTo('#content') 
     .load(url, function(){ 
      filterOneArticle(this); 
     }); 
}); 

// I want this function run after all articles will be loaded and filtered 
$.bind('yepAllArticlesHaveBeenLoaded', filterAllArticles); 

filterAllArticles = function() {}; 
filterOneArticle = function(el) {}; 

Answer 1

Если по каким-либо причинам вам не хотите использовать ajaxStop, поскольку Ник предлагает (возможно, вы беспокоитесь о том, что другие, несвязанные запросы ajax отбрасывают вас), вы можете отслеживать, сколько запросов вы выдали, и проверить, когда каждый из них преуспевает/сбой:

var requestCount = 0; 
$('#links a').each(function (index, el) { 
    url = $(el).attr('href'); 
    ++requestCount; 
    $('<div class="article" />').appendTo('#content') 
     .load(url, function(){ 
      filterOneArticle(this); 
      --requestCount; 
      if (requestCount == 0) { 
       filterAllArticles(); 
      } 
     }); 
}); 

Это выглядит нравится ему ha s состояние гонки (Что делать, если первая статья заканчивает загрузку, прежде чем мы запросили вторую?), но это не так. JavaScript в браузерах является однопоточным (запрет использования web workers, который вам нужно сделать явно), и поэтому мы знаем, что мы закончим наш цикл, инициирующий запросы до того, как может пройти первое завершение.

Answer 2

Там ajaxStop глобальное событие для это:

$(document).ajaxStop(filterAllArticles); 

Чтобы отвязать его, чтобы он не работает, когда следующий Аякса партии отделки (если есть больше Аякса активность позже), вы можете просто позвонить .unbind() в вашем filterAllArticles метод:

$(document).unbind("ajaxStop", filterAllArticles); 

Answer 3

jQuery поддерживает это поведение. вы можете использовать jQuery для вызова ajax, как показано ниже. этот метод имеет две функции обратного вызова для успеха и для отказа.

function loadData() 
{ 
    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     url: 'methodurl', 
     success: methodSuccedded, 
     error: methodFailure 
    }); 
} 

function methodSuccedded() 
{} 

function methodFailure() 
{}