How to create event triggered after a some ajax calls completed?

Please, help me create right event for my situation. I believe there is true way to do it, without any counters (like this: 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(){
            filterOneArti开发者_如何学运维cle(this);
        });
});

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

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

If for whatever reason you don't want to use ajaxStop as Nick suggests (perhaps you're worried about other, unrelated ajax requests throwing you off), you can keep track of how many requests you've issued and check when each one succeeds/fails:

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();
            }
        });
});

That looks like it has a race condition (What if the first article finishes loading before we've requested the second?), but it doesn't. JavaScript on browsers is single-threaded (barring the use of web workers, which you have to do explicitly), and so we know we'll finish our loop initiating the requests before the first completion can come through.

There an ajaxStop global event for this:

$(document).ajaxStop(filterAllArticles);

To unbind it so it doesn't run when the next ajax batch finishes (if there is any more ajax activity later), you can just call .unbind() in your filterAllArticles method:

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

jQuery supports this behavior. you can use jQuery to do the ajax call as show below. this method has two call back functions for success and for failure.

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

function methodSuccedded()
{}

function methodFailure()
{}