Question

I wanted write preloader images and I was stuck on the checking already lodead images:

var imgContainer = [];

$(this).find('img').each(function() {
    imgContainer.push({
        image: $(this)
        // other properties
    })
});

setInterval(function() {
    console.log(imgContainer[0].image.complete);  // undefined
}, 2000);

but this solution worked (without objects in array):

var imgContainer = $(this).find('img');

setInterval(function() {
    console.log(imgContainer[0].complete)         // true
}, 2000);

Why it’s not working?

Answer 1

Instead of using setInterval ,for checking whether all images are loaded, just replace your above code with this code:

(function(that){
    var remains = 0;        
    var loadHandler = function(){
       if(--remains == 0){
          console.log('All images are loaded !!!');
       }   
    };

    $(that).find('img').each(function() {
         if( !this.complete ){
             remains++;
             $(this).load(loadHandler);
         }
    });        
})(this);