Phát hiện nhiều sự kiện tải ảnh

Question

Tôi tự hỏi nếu có cách nào phát hiện sự kiện tải của nhiều ảnh (đặc biệt, một hàm sẽ thực thi khi ảnh cuối cùng trong một tập đã cho tải xong).

Ví dụ: người dùng nhấp vào liên kết và lighbox xuất hiện với 10 hình ảnh. Khi tất cả hình ảnh đã được tải, thanh tải sẽ biến mất.

jQuery(".lightbox-image").each(function(){ 
    var image = jQuery(this); 
    jQuery('<img />').attr('src', image.attr('src')).load(function(){ 
     hideLoadingBar(); 
    }); 
}); 

Thật không may này kích hoạt hideLoadingBar(); quá sớm (sau khi một ảnh đã hoàn tất tải).

P.S.
Tôi cũng cần chức năng của mình để hoạt động sau khi hình ảnh được lưu vào bộ nhớ cache: jQuery('#img1, #img2').load(); sẽ không hoạt động.

Answer 1

Kiểm tra plugin jQuery imagesLoaded này, nó phải phù hợp với nhu cầu của bạn mà tôi nghĩ.

Answer 2

Vâng, có vẻ như không ai có ý tưởng tốt hơn, vì vậy dưới đây là giải pháp/giải pháp của tôi. Câu trả lời khác cho câu hỏi này có lẽ là những gì bạn muốn sử dụng vì đó là một thư viện được tạo ra đặc biệt cho rằng nhưng đây là giải pháp mà tôi sẽ sử dụng vì nó ngắn và đơn giản:

var allImages = jQuery(".lightbox-image").length; 
var counter = 0; 
jQuery(".lightbox-image").each(function(){ 
    var image = jQuery(this).find('.myimage'); 
    jQuery('<img />').attr('src', image.attr('src')).load(function(){ 
     counter++; 
     if(counter >= allImages){ 
      hideLoadingBar(); 
     } 
    }); 
}); 

trình cho hình ảnh được lưu trữ và hình ảnh không được lưu trong bộ nhớ cache.