Question

Can someone explain to me why I was running across a race condition with this block of code:

$("#someid").load( "home.php", callback_function );
function callback_function()
{
    //some jQuery.get() goes here
}

and not this block of code:

$("#someid").load( "home.php", function(){ callback_function(); } );
function callback_function()
{
    //some jQuery.get() goes here
}

The race condition in the first block of code was that processing in callback_function() would not execute after the load was done, but seemed to run asynchronously and would screw up some UI stuff (this UI stuff was dependent on the jQuery.get() returning). I’m new to jQuery/JavaScript and was wondering why I need the explicit “function(){ callback_function(); }”. Thanks!

Answer 1

check out send a jquery callback function inside a variable

declare the function like

function callback_function(){
  //some jQuery.get() goes here
}

or

var callback_function = function(){
  //some jQuery.get() goes here
}

then try this

$("#someid").load( "home.php",null, callback_function );

pass the callback parameter as 3rd argument to avoid confusion to the jquery load API(sorry not getting exact word :)).

see load documentation,