Почему обратный вызов в javascript не работает?

Question

Я хочу, чтобы вызвать вторую функцию после первого завершения

function first(callback) { 
    alert('called first'); 
    $('.fillColor1').animate({ 
     height: '50px' 
    }, 600); 
} 

function second() { 
    alert('called second'); 
    $('.fillColor2').animate({ 
     height: '50px' 
    }, 600); 
} 

$('button').click(function() { 
    first(second);  
}); 

Here is the code what i want on jsfiddle

Я получил эту проблему, то я искал это и приземлился на эту ссылку

Execute jquery function after another function completes

Пожалуйста, дайте я знаю, есть ли какая-либо ошибка, я делаю

Заранее спасибо

Answer 1

Edit, Обновлено

function first(callback) { 
    alert('called first'); 
    $('.fillColor1').animate({ 
     height: '50px' 
    }, 600, callback); 
} 

function second() { 
    alert('called second'); 
    $('.fillColor2').animate({ 
     height: '50px' 
    }, 600); 
} 

$('button').click(function() { 
    first(second);  
}); 

jsfiddle http://jsfiddle.net/zqgfz54b/1/

Альтернативно

function fx(elem, callback) { 
    alert('called ' + elem[0]); 
    $('.fillColor' + elem[0]) 
    .animate({ 
     height: '50px' 
    }, 600, function() { 
     elem.splice(0, 1); 
     callback.call($, elem) 
    }); 
}; 

$('button').click(function() { 
    fx.call($, [1, 2], fx);  
}); 

jsfiddle http://jsfiddle.net/zqgfz54b/2/

Answer 2

Вы должны фактически вызвать обратный вызов после первой функции:

function first(callback) { 
    alert('called first'); 
    $('.fillColor1').animate({ 
     height: '50px' 
    }, 600, callback); 
} 

function second() { 
    alert('called second'); 
    //Do Code 
} 

$('button').click(function() { 
    first(second);  
});