Javascript 有没有办法确定何时使用JS加载了4个图像？

我在一页上有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" />

关于这一点，最好使用闭包来避免全局变量，例如：

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

    return function () {
        if (++count === numImages) { 
            //All images have loaded    
        }
    };
}());

[编辑]

---

根据，我将硬编码的值4（

count==4

）替换为jQuery

size

函数，以便在函数中提供更大的灵活性。

除非这是页面上仅有的四个图像，否则，您需要为它们分配一个类，或者从文档中选择这四个图像。（例如，

$（“img.dynloaded”）.load（…）

）是的，因为$（“img”）选择器正在选择页面上的每个标记谢谢，这正是我所需要的，它与：var noImages=$（“img”）.size（）组合在一起；而不是4，让它更灵活…杰罗恩，谢谢你的评论；我现在更新了函数；-）

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

    return function () {
        if (++count === numImages) { 
            //All images have loaded    
        }
    };
}());