如何处理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); 
})