有没有办法确定何时使用JS加载了4张图像?

Dar*_*ein 2 javascript jquery image

我在页面上有4张图片.我想在加载所有4个图像后触发JS事件.我当然无法确定将加载图像的顺序,因此我无法在最后一张图像上触发事件.一个想法是有一个计数器,但我想不出最好的方法来检查该计数器何时等于4,因为我不喜欢每200ms检查一次setTimeout()的想法.

还有其他想法吗?

我在网站上使用jQuery,所以我认为这可能会有所帮助.

这是图像HTML代码:

<img src="/images/hp_image-1.jpg" width="553" height="180" id="featureImg1" />
<img src="/images/hp_image-2.jpg" width="553" height="180" id="featureImg2" />
<img src="/images/hp_image-3.jpg" width="553" height="180" id="featureImg3" />
<img src="/images/hp_image-4.jpg" width="553" height="180" id="featureImg4" />
Run Code Online (Sandbox Code Playgroud)

And*_*ech 8

至于Salty的例子,最好使用闭包来避免全局变量,例如:

$("img").load(function() {    
    var count = 0, numImages = $("img").size();

    return function () {
        if (++count === numImages) { 
            //All images have loaded    
        }
    };
}());
Run Code Online (Sandbox Code Playgroud)

[编辑]

根据jeroen的评论,我用count === 4jQuery size函数替换了4()的硬编码值,以便在函数内提供更大的灵活性.