Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery.html( something ) detect when injection is complete

In a nutshell I want a callback to fire after the html has been injected and the content of that html has rendered. Reason being I need to know the height of the new content right away. Something like this:

  $('div').html(tonsofstuff);
  console.log( $('div').height() ); //works in Firefox, but returns 0 in Chrome
  setTimeout(function(){
        console.log( $('div').height() ); //works everywhere, but takes too long
  },3000);

The issue is occasionally in some browsers (and always in chrome) $('div').height() fires before the new content has a height.

My fantasy:

  $('div').html(tonsofstuff, function(){
        console.log( $('div').height() );
  });

  or even

  $('div').html(tonsofstuff).load(function(){
        console.log( $('div').height() );
  });
like image 635
Fresheyeball Avatar asked Jan 20 '12 18:01

Fresheyeball


1 Answers

This is what I do:

var height = $('div').html(tonsofstuff).height();

I never had any problems with waiting for it to render.

like image 170
qwertymk Avatar answered Oct 14 '22 22:10

qwertymk