Заказ событий jQuery

Question

Почему функция обратного вызова события click btnSubmit запускается первым, а затем анимация , а событие btnSubmit2 - функция обратного вызова происходит после завершения анимации?

$('#btnSubmit').click(function() { 
    $('#testDiv').hide('slow,', onComplete()); 
}); 

var onComplete = function() { 
    alert('test'); 
} 

$('#btnSubmit2').click(function() { 
    $('#testDiv').hide('slow', function() { 
     alert('test'); 
    }); 
}); 

HTML

<form id="form1" runat="server"> 
    <div> 
     <input type="text" id="auto" /> 
     <input type="text" id="auto2" /> 
    </div> 
    <a id="btnSubmit" href="#">SUBMIT</a> 
    <a id="btnSubmit2" href="#">SUBMIT 2</a> 

    <div id="testDiv">Here's some test text</div> 
</form> 

Answer 1

В этой строке:

$('#testDiv').hide('slow,', onComplete()); 

Потому что у вас есть круглые скобки там, вы сразу же выполняет функцию onComplete.

Попробуйте вместо этого:

$('#testDiv').hide('slow,', onComplete); 

Это передает ссылку на эту функцию вместо того, чтобы исполнить его.

Answer 2

Вы не пропускание Ссылки на функцию

$('#testDiv').hide('slow,', onComplete()); 

Вы выполнение функции и передачи возвращаемого значения (undefined) методу hide.

Answer 3

Посмотрите разницу между двумя частями кода. В одном вы передаете анонимную функцию с вызовом alert внутри. Другой вы сразу вызываете свою функцию.

$('#testDiv').hide('slow,', onComplete()); 

Должен быть

$('#testDiv').hide('slow,', onComplete); 

В противном случае вы передаете результат функции как обратный вызов, а не сама функция.