Question

我一直在构建一个图像预加载器，并且发现我需要将图像URL放在图像标记的数据属性中，以便立即停止所有图像的加载。

我有以下HTML：

<div class="slide-item"><img data-url="http://www.domain.com/image.jpg" /></div>
<div class="slide-item"><img data-url="http://www.domain.com/image.jpg" /></div>
<div class="slide-item"><img data-url="http://www.domain.com/image.jpg" /></div>
<div class="slide-item"><img data-url="http://www.domain.com/image.jpg" /></div>
<div class="slide-item"><img data-url="http://www.domain.com/image.jpg" /></div>
<div class="slide-item"><img data-url="http://www.domain.com/image.jpg" /></div>
...

以下jQuery：

$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
}

var imageArray = [];
$('.slide-item img').each(function() {
    var img = $(this).data('url');
    imageArray.push(img); 
});

$([imageArray]).preload();

我的目标是让每个图像按顺序加载，并在加载后显示。

我的问题是，如果将网址预加载后如何将其加载到图片中？

我测试过并发现了＆＃39; imageArray＆＃39;包含正确的图片网址，并将其传递给预先加载＆＃39;功能，但我无法弄清楚如何显示其加载的图像。

预加载图像后加载SRC

0 个答案: