沒有使用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（）

回答

相關問題