Question

我创建了一个Image对象列表。每个Image的onload功能都是相同的：

function tracker() {
    ++loadedImage;
    if (loadedImage === total) ..
}

images[i].src = urls[i];

此函数尝试查看是否已加载所有图像，如果是，则调用另一个函数。但是，有几个源是非法的（可能不存在），因此永远不会为这些图像调用onload函数。我想增加loadedImage，即使该对象被赋予非法来源。但是我可以知道图像是否被赋予非法来源吗？

谢谢。

Answer 1

图片也有error个事件。您也可以将其挂钩并从此处计算失败的负载。

如果您打算支持IE8-，请注意，如果图像恰好已存在于浏览器的缓存中，则load事件将不会触发。

Answer 2

根据您想要实现的目标（以及何时），window.onload可能是另一种选择。当文档和加载所有资源时，它会触发

<img src="http://lorempixel.com/100/100"/>
<img src="http://lorempixel.com/a/b"/>
<img src="http://placehold.it/200x50"/>

window.onload = function(evt) {
    console.log('window.onload');
}

var imgs = document.getElementsByTagName('img');
for (var i = 0; i < imgs.length; ++i) {
    var img = imgs[i];
    img.onload = function(evt) {
        console.log('src=' + this.src + ', ready');
    }
    img.onerror = function(evt) {
        console.log('src=' + this.src + ', error');
    }
}

JSFiddle

如何知道图像是否被赋予非法来源？

2 个答案: