image.onload在图像完全加载之前触发

时间:2012-02-10 12:11:44

标签: javascript html5 mobile-safari html5-canvas android-browser

我正在使用javascript + canvas制作游戏。 我使用下面的代码来确保

var imgLoaded = 0;
var imgToLoad = multiImgs;
var onImgLoad = function()
{
   imgLoaded++;
   if(imgLoaded == imgToLoad)
   {
      ctx.drawImage()
   }
}

for(var i = 0; i < multiImgs; i++)
{
  images[i] = new Image();
  images[i].onload = onImgLoad();
  images[i].src = 'images/'+i+'.png';
}

此代码有时可以正常工作,尤其是当图像被缓存时。但是,第一次加载时,它会给出INDEX_SIZE_ERR:DOM异常1 我找到的是由于高度和高度Quickredfox在此answer中建议的图像宽度不可用...但是这里只有在加载了所有图像时才调用drawImage? 该错误主要发生在移动设备

1 个答案:

答案 0 :(得分:8)

您必须向加载处理程序提供引用。否则,该函数立即执行。使用:

images[i].onload = onImgLoad;