El complemento que escribió @alex no funcionó para mí por alguna razón... No pude entender por qué. Pero su código me inspiró a idear una solución más liviana que funciona para mí. Utiliza promesas de jquery. Tenga en cuenta que, a diferencia del complemento de @alex, esto no intenta tener en cuenta las imágenes de fondo en los elementos, solo los elementos img.

 // Fn to allow an event to fire after all images are loaded $.fn.imagesLoaded = function () { // get all the images (excluding those with no src attribute) var $imgs = this.find('img[src!=""]'); // if there's no images, just return an already resolved promise if (!$imgs.length) {return $.Deferred().resolve().promise();} // for each image, add a deferred object to the array which resolves when the image is loaded (or if loading fails) var dfds = []; $imgs.each(function(){ var dfd = $.Deferred(); dfds.push(dfd); var img = new Image(); img.onload = function(){dfd.resolve();} img.onerror = function(){dfd.resolve();} img.src = this.src; }); // return a master promise object which will resolve when all the deferred objects have resolved // IE - when all the images are loaded return $.when.apply($,dfds); }

Entonces puedes usarlo algo como esto:

 $.ajax({ cache: false, url: 'ajax/content.php', success: function(data) { $('#divajax').html(data).imagesLoaded().then(function(){ // do stuff after images are loaded here }); } });

Esperemos que sea útil para alguien.

Tenga en cuenta que al usar el código anterior, si una de las imágenes falla (por ejemplo, porque la URL era incorrecta), la promesa se resuelve de todos modos y el error se ignora. Esto podría ser lo que desea, pero, dependiendo de su situación, es posible que desee cancelar lo que esté haciendo si una imagen no se carga. En cuyo caso, podría reemplazar la línea onerror de la siguiente manera:

 img.onerror = function(){dfd.reject();}

Y atrapa el error así:

 $('#divajax').html(data).imagesLoaded().done(function(){ // do stuff after all images are loaded successfully here }).fail(function(){ // do stuff if any one of the images fails to load });

Podrías usar mi plugin jQuery, waitForImages ...

 $.ajax({ cache: false, url: 'ajax/content.php', success: function(data) { $('#divajax').html(data).hide().waitForImages(function() { $(this).show(); }); } });

Esto cargará las cosas en su elemento, lo ocultará y luego lo volverá a mostrar una vez que se hayan cargado los elementos img descendientes.

Puede vincular algo a los eventos de carga para saber cuándo terminaron:

 $('<img>').bind('load', function() { $(this).appendTo('body'); });

O podrías usar este complemento .