不能附加eventlistener onload事件<img> -Tag

我想知道爲什麼我不能附加eventlistener到html圖像的onload事件。不能附加eventlistener onload事件<img> -Tag

<img id="imageID" onload="doSomething();">完美的作品，

，但如果我想添加一個聽衆喜歡

document.getElementById('imageID').addEventListener('onload', function(e) { 
    doSomething(); 
    });

或使用jQuery

$("imageID").on("onload", function(){ 
doSomething(); 
});

不被逮住的事件。如果我聽一個簡單的「點擊」 - 事件它的作品，但沒有「onload」 - 事件。

有人可以告訴我這種行爲的原因嗎？

來源

2012-12-06 Hartmut Grom

請勿在活動名稱中包含"on"。

       // no "on"------------v 
document.getElementById('imageID').addEventListener('load', function(e) {

// no "on"----v 
$("#imageID").on("load", function(){ 
// ^----need "#"

來源

2012-12-06 16:39:53

謝謝，一個簡單而有效的解決方案！我在html標記和js是相同的事件，但它看起來好像這是錯誤的（像onload事件http://www.w3schools.com/jsref/event_img_onload.asp） –

@HartmutGrom：w3schools有一個很多信息，但深度和準確性有時並不輝煌（請參閱http://w3fools.com/瞭解更多信息）。更可靠的DOM參考資料[可從W3C獲得]（http://www.w3.org/DOM/DOMTR）和[MDN]（https://developer.mozilla.org/en-US/docs/ JavaScript/Reference）通常具有不錯的信息，儘管有時候人們貢獻的代碼樣本並不是最好的質量。 –

這裏有問題。

您不要在活動名稱中加上「on」，如I Hate Lazy said。
如果你想鉤這已經在頁面上的圖像上的負載情況下，你將有一個競爭狀態，有時會看不到的事件，因爲它可以「裝」了即時將其放在頁面上（如果相關圖像在緩存中）。您必須在之前掛載加載圖像具有src屬性，這通常意味着動態添加圖像。您的DOM0處理程序（onload="doSomething()"）可以工作，因爲它在圖像添加到文檔時已經連接，但稍後在頁面上查看圖像的任何內容（getElementById或jQuery）可能會錯過它。

來源

2012-12-06 16:41:54

感謝提到＃2。我正在通過jQuery動態地改變src屬性，所以這應該是沒問題的 –

@HartmutGrom：只要你在*之前掛鉤事件*，你改變'src'屬性，的確應該沒問題。（但是即使在連續兩行代碼中更改'src'然後掛鉤它，即使基於瀏覽器的JavaScript是單線程的（因爲瀏覽器不是），也存在爭用條件。） –

不能附加eventlistener onload事件<img> -Tag

回答

相關問題