Search code examples
javascriptjqueryready

Pause jQuery ready events until multiple HTML DOM updates are finished


I am using jQuery to make AJAX submits and receive JSON replies containing multiple DOM IDs and corresponding HTML fragments that I need to update. Thus, I do multiple jQuery.html calls like $('#id1').html('...'); $('#id2').html('...');.

For every fragment containing a ready handler like $(function(){...});, the event is immediately triggered. I'd prefer to call it once after all updates were made.

Is there any way to do that?

From what I've read so far, a jQuery.trigger() could be used to manually trigger the ready event. But I'd need to save and restore the current handlers or postpone event delivery by overwriting the jQuery internals somehow. The latter is something that I'd like to avoid, maybe there's some best practice I don't know yet?


Solution

  • Have a look at the holdReady function.

    See: http://api.jquery.com/jQuery.holdReady/