.load() not firing for uncached images - jquery

Question

in safari and opera, the callback function of .load doesn't wait for uncached images to be fully loaded. with cached images it works perfectly fine.

the code is a little complicated, i'll try to simplify...

so, my js is this:

        $('#chatwindow_' + thread_id).load('/chat.php?thread_id=' + thread_id, function(){


            $('#chatwindow_' + thread_id).children('.chat_messagebox').load('/messages.php?sel=chat&latest_messages=10&thread_id=' + thread_id, function(){

//THIS IS BEING EXECUTED BEFORE THE IMAGES ARE FULLY LOADED, 
//BUT I EXPECT IT TO BE EXEC AFTER THE IMAGES ARE LOADED

                $(this).scrollTo('max',0);
                $('#chatwindow_' + thread_id).find('.messages_newcontent').focus();
        });


    });

messages.php?sel=chat:

<? include(gen_path("/messages_messagelist.php")); ?>

messages_messagelist.php:

while($x < $x_total){
load_attachments("message_".$message_row['id'], $max_width_of_att_field)
}

and finally the important snippet from the function:

return "<img src='/upload/attachments/".$attachments_row['id']."' width='160' class='download_file info_nextsibling' id='downloadfillabeobj_".$attachments_row['id']."'>"

and that's it - and if this final < img > is not cached, it gets fully loaded after the initial .load callback function is called - any ideas on how to wait for all the uncached images?

Answer 1

Look into David DeSandro's imagesLoaded jQuery plugin here .

From the docs:

"you can't do .load() on cached images"