在JavaScript中動態加載圖像的好方法的建議

Question

我正在編寫一個需要動態加載大量圖像的Web應用程序。
我寫了一個效用函數，loadMultipleImages，這需要它們加載並調用（可能是可選）回調的照顧，每當：

• 單個圖像加載
• 遇到錯誤時（單個圖像不能負載）
• 所有的圖像加載沒有錯誤

我調用它像這樣（你可以找到一個完整的例子here）：

var imageResources = []; 
     var mulArgs = {multipleImages: [], 
         onComplete: this.afterLoading.bind(MYAPP), 
         onError: this.logError.bind(MYAPP) 
     } 

imageResources = ["imageA_1.png", "imageA_2.png"]; 
mulArgs.multipleImages.push ({ID: "imageA_loader", imageNames : imageResources}); 

imageResources = ["imageB_1.png", "imageB_2.png"]; 
mulArgs.multipleImages.push ({ID: "imageB_loader", imageNames : imageResources}); 

//Lots of more images 

var mImageLoader = new loadMultipleImages (mulArgs); 

一旦我創建了我的loadMultipleImages對象，它將加載圖像並在所有加載後調用afterLoading（）函數（或者如果存在某個問題，則調用logError（））。然後我可以訪問的圖像：

MYAPP.afterLoading = function (loaders) { 
    // Just an example 
    var imageA_array = loaders["imageA_loader"].images; 
    var imageB_first = loaders["imageB_loader"].images[0]; 
} 

順便說一下，我想我正在重新發明（可能方形）輪。有沒有一個輕量級，簡單的庫，比我做得更好？或者只是一種更好的方法，可以省去保存loadMultipleImages代碼的負擔？

Answer 1

http://jsfromhell.com/classes/preloader