Bild Preloader Rückruf Brennen, bevor alle Bilder

Question

Problem geladen haben:

Ich versuche Bild zu tun Vorbelastung und fand this awesome solution, die ich versucht habe zu adapt.I den Code nahm und es eingewickelt in einer Funktion, die gibt ein Versprechen zurück, aber ich bemerkte, dass der done() Handler genannt wurde, bevor alle Bilder geladen wurden, was mache ich falsch?

Code:

function preload(args) { 

    var $defer = $.Deferred(); 
    var preload = args; 
    var promises = []; 
    for (var i = 0; i < preload.length; i++) { 
    (function(url, promise) { 
     var img = new Image(); 
     img.onload = function() { 
     promise.resolve(); 
     console.log("loaded:" + url); 
     }; 
     console.log("loading:" + url); 
     img.src = url; 
    })(preload[i], promises[i] = $.Deferred()); 
    } 
    $.when.apply($, promises).done(function() { 
    console.log("All images ready sir!"); 
    $defer.resolve(); 
    }); 

    return $defer; 
} 

var images = ['https://pbs.twimg.com/media/CbM1w65UcAAKfSJ.jpg', 'https://www.kenrockwell.com/nikon/d600/sample-images/600_0985.JPG', 'https://developer.nvidia.com/sites/default/files/akamai/gameworks/blog/GameWorks_Vulkan_and_OpenGL_Samples/vulkan2.png', 'https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcSKJ1fJHxLQ6unFkHZnHJoT-RfqrBvWMrzhmRFAPUt0VvdvZSDd', 'https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcTyvamruO8NCTeQJXtQaXM8xEQS5P9ANh_npfgZpv-7x8ISvzX5zg']; 

preload(images).done(function() { 
    console.log("OK, begin business process.."); 

}); 

Konsolenausgabe:

JSFIDDLE:

https://jsfiddle.net/sajjansarkar/f5k94n2r/

Answer 1

tauschen diese beiden Linien

promise.resolve(); 
    console.log("loaded:" + url); 

Das Versprechen ist die Lösung, die den Rest der Entschlossenheit Kette auslöst. Dann wird die Protokollnachricht hinzugefügt.