Jquery warning when all dynamic images end up loading

Question

I use a function to dynamically load images into a div via an ajax call. I need to show the gif image of the upload when the image starts to load and hide when all the images finish uploading. My main task is to find out when all the images have finished loading.

This is my code.

 $('img').on('load', function ()
 {
alert("image loaded: "+this.src);
 });

But this warning continues to trigger every image.

Remember that images are loaded via an ajax call after the page loads.

Answer 1

Do it like that

function loadAllImagesFromArray(images){
     for(i = 0 ; i < images.length; i++){
        var imageUrl = images[i];
        // closure to make sure that the value of i is preserved inside the context
        (function(i){
           $.ajax({
             url: imageUrl,
           }).done(function(image) {
             if(i == images.length - 1)
              alert("Image loaded");
           });
        }(i));
      }
    }

Answer 2

$('img'), , . , , .