jQuery：加载多张图像但只有一张未完成答案

【问题标题】：jQuery: Loading multiple images but just one oncompletejQuery：加载多张图像但只有一张未完成
【发布时间】：2013-12-24 18:32:08
【问题描述】：

如何使用 load() 函数从一组图像中获取一个完整的调用？

例子：

$(img_nodes).load(function()
{
    _this.scaleImages();
});

img_nodes 包含两个图像(<img>, array)。这种方式会导致两次调用函数_this.scaleImages();

如何设置它以在从阵列中加载所有图像后只完成一个？

编辑：

img_node内容：

var items_node = $('root_node).find('.items');

var img_nodes = items_node.find('img');

谢谢！

【问题讨论】：

【解决方案1】：

为图像数量设置一个计数器。每个回调都可以递减，到0就知道所有图片都加载完了。

var counter = $(img_nodes).length;
$(img_nodes).load(function() {
    if (--counter == 0) {
        _this.scaleImages();
    }
}

【讨论】：

【解决方案2】：

既然你知道你有多少张图片，

var nbImgs = $(img_nodes).length;
var nbImgsLoaded = 0;

然后在每次加载时增加 nbImgsLoaded，然后与 nbImgs 进行比较，如果它们相等，则意味着所有图像都已加载，那么您可以调用任何您想要的函数。

【讨论】：

【解决方案3】：

这个怎么样？

$.each($('root_node).find('.items'),function(){
    $(this).scaleImages();
});

【讨论】：