如何處理img標籤和其他人的onLoad事件

Question

如何處理onLoad img標籤上的事件？

例如：

$ ('img'). onload (function (e) { 
    alert ('image loaded' + $ (this), attr ('src')); 
}) 

就像ImageLoader的

和其他標籤，如腳本，鏈接，等等

Answer 1

jQuery callback on image load (even when the image is cached)

$("img").one('load', function() { 
    // do stuff 
}).each(function() { 
    if(this.complete) $(this).load(); 
}); 

似乎爲我工作，並應該解決與緩存警告。

Answer 2

有一個如何在jQuery doc page for .load()上執行此操作的示例。

HTML：

<img src="book.png" alt="Book" id="book" /> 

的Javascript：

$('#book').load(function() { 
    // Handler for .load() called. 
}); 

而且，還有一堆需要注意的地方需要注意的是jQuery的網頁上列出了。

使用圖像時，如果要確保裝載處理程序被調用，則必須先設置裝載處理程序，然後才能裝載圖像。如果您使用代碼構建圖像，這意味着您必須在設置.src屬性之前設置裝入處理程序。這是因爲，在某些瀏覽器中，如果映像位於內存/磁盤緩存中，則在分配.src時會立即加載，如果隨後設置了​​處理程序，則會太晚（圖像已經加載）以及​​處理程序將永遠不會被調用。

我不知道如何保證一個基於jQuery的.load（）總是被調用，因爲你的頁面中的圖像是HTML，因爲你不能分配事件處理程序直到對象存在，但是一旦對象它退出，它可能已經被加載。您可以在實際的HTML中使用onload = xxx的非jQuery設置，儘管這是一種較舊的編碼風格。當然，你總是可以掛鉤window.onload，以知道何時加載了所有頁面圖像（和其他資源）。

Answer 3

jQuery有一個load方法，而不是onload。而你的代碼應該是：

$ ('img').load(function() { 
    alert('image loaded ' + this.src); 
})