jquery load event sometimes dont work, why?

Question

hi!

i use something like this

$(img).bind('load',function(){
       console.log('loaded');
});

and obviously it works, but when the page is loading images from cache the event isn't triggered.

how can i fix this situation?

Answer 1

Fount it! each image has a .complete property(boolean) so i just need to check that before i bind a load event.

Answer 2

This event isn't triggered in some browsers if the image is cached, to get around that you need to check the .complete property, like this:

$("img").one('load',function(){
       console.log('loaded');
}).each(function() {
  if(this.complete) $(this).load();
});

The .one() ensures it doesn't fire twice, the .each() part is manually firing the event for cached images that aren't doing a load event themselves.