Question

I’m trying to apply what I learned about callback functions in this post I made to extend to 3 functions, but am having some trouble getting things working. Can someone please help me understand how I can get these three functions to fire in sequence?

var yourCallback = function(args, second) {
    var t = setTimeout(function() {
        $('body').append(args);
    }, 800);

    second('3-');


}

var yourSecondCallback = function(args) {
    var t = setTimeout(function() {
        $('body').append(args);
    }, 800);
}

function function1(args, callback, yourSecondCallback) {
    $('body').append(args);
    if (callback) {
        callback('2-');
    }

}


function1('1-' , yourCallback);​

http://jsfiddle.net/loren_hibbard/WfKx2/3/

Thank you very much!

Answer 1

You need to nest the callbacks to get them to call in order.

var yourCallback = function(args, second) {
    var t = setTimeout(function() {
        $('body').append(args);
        second('3-');
    }, 800);
}

var yourSecondCallback = function(args) {
    var t = setTimeout(function() {
        $('body').append(args);
    }, 800);
}

function function1(args, callback) {
    $('body').append(args);
    if (callback) {
        callback('2-', yourSecondCallback);
    }

}


function1('1-' , yourCallback);​

Here’s your altered fiddle