图像加载完成后触发的Javascript函数(没有jQuery)

时间:2012-04-22 15:22:24

标签: javascript image html5 object

我有以下代码(相关部分):

window.addEventListener("load", loadImages, false);

var imgl = new Array();

function loadImages() {
    var img = [
        "img1",
        "img2",
        "img3",
        "etc"
    ];
    imgl[img.length-1].onload = function () {
        alert();
        initialise();
    }
    for (i = 0; i < img.length; i++) {
        imgl[img[i]] = new Image();
        imgl[img[i]].src = "img/"+img[i]+".png";
    }
}

function initialise() {
    //...
}

我希望在所有图像加载完毕后触发initialise()函数,但我没有尝试过。 (顺便说一下,示例中的alert()用于测试,我没有得到它。)为什么这是错的?其他方法也很受欢迎。

我也不想使用jQuery,只有绝对不可避免。

提前致谢。

编辑:

以下情况也不起作用,虽然更有意义:

for (i = 0; i < img.length; i++) {
        imgl[img[i]] = new Image();
    }
    imgl[imgl.length-1].onload = function () {
        initialise();
    }
    for (i = 0; i < img.length; i++) {
        imgl[img[i]].src = "img/"+img[i]+".png";
    }

1 个答案:

答案 0 :(得分:1)

imgl[img.length-1]不存在,因此不能具有“onload”属性。

您在开始时初始化img1,但从不填充它。

换句话说: img.length-1 = 3

img1[3]不存在。

我收到以下错误消息:

  

未捕获的TypeError:无法设置未定义的属性'onload'