加载新图像时运行JavaScript

Question

我对这个问题做了一些研究，但我的情况很奇怪。我写了一个函数来使用ajax获取一些图像资源并将其存储在js中的变量中。 window.onload（）在第一次正常工作，它在显示之前将所有图像加载到变量，但之后我点击链接再次使用ajax将更多图片加载到该变量，我不知道如何显示那些新的仅当它们完全存储在该变量中时。请帮帮我。 谢谢，戴。

Answer 1

可以使用img.onload跟踪单个图像的加载。因此，如果您正在加载一堆图像并想知道它们何时全部加载，您必须在所有图像上放置onload处理程序并累计计算它们何时全部加载。

var loadCnt = 0;
function cntLoads() {
    ++loadCnt;
    if (loadCnt > 20) {
        // all images loaded now, do whatever you want to do here
    }

}

var img1 = new Image();
img1.onload = cntLoads;
img1.src "xxxx";

var img2 = new Image();
img2.onload = cntLoads;
img2.src "yyyyy";

....