没有使用onload（）

绘制小白色矩形但不是图像为什么它是这样以及如何修复它。没有使用onload（）

var imageReady = false; 
img = new Image(); 
img.src = 'player.png'; 
img.onload = loaded(); 

function loaded() { 
imageReady = true; 
redraw(); 
} 

function redraw() { 
    //ctx.fillStyle = "blue"; 
    //ctx.fillRect(0, 0, 500, 500); 

    if (imageReady) { 
     ctx.fillStyle = "white"; 
     ctx.fillRect(10,10,10,10); 
     ctx.drawImage(img, 5, 5); 
    } 
}

来源

2013-08-06 Myrez

你能分享更多的代码吗？我假设你在img的onload中改变了imageRead。正确？ – wendelbsilva

添加更多代码 – Myrez

您正在通过loaded()到onload。尝试通过img.onload = loaded;

Like this (JSFiddle Here)。

var imageReady = false; 
img = new Image(); 
img.onload = loaded;

还有一件事，我建议你在src之前设置onload。我不知道浏览器如何在内部执行加载，但可能会加载太快的图像，您将在加载后发送onload。那可能吗？不知道。

编辑

是的，它也更好回调img.onload = loaded设置src前值相关联。刚刚经过测试，如果图像处于缓存中，它可能会在与之关联之前调用onload。

来源

2013-08-06 22:11:41 wendelbsilva

非常感谢。但为什么你必须像这样传递它：加载，而不是像这样：loaded（）： – Myrez

它的回调函数。当您执行'= loaded（）'时，您正在调用加载的函数并将其返回到'onload'。但是你想要的是给img一个函数，这样它就可以在图像准备就绪时执行。 – wendelbsilva

您正在调用您的loaded()函数并将img.onload分配给该函数的返回值，而不是将img.onload分配给您的函数。尝试将您的任务更改为：

img.onload = loaded;

另外，我不确定是否看到imageLoaded标志的这一点。

来源

2013-08-06 22:18:16 Lochemage

没有使用onload（）

回答

相关问题