我想在加载图像时运行一些代码。另外，我想不显眼地做（不是内联）。更具体地说，我想使用 jQuery 的 live() 函数，这样任何动态加载的图像都会发生这种情况。
我试过了：
<img class="content_image" alt="" src="..." />
<script>
$('.content_image').live('load', function() {
alert('loaded!');
});
</script>
除了load，我还试过onload和onLoad。当我用“点击”替换时，一切都按预期工作，所以我知道这不是一些干扰错误。
我无法找到live() 函数的可用事件类型列表，所以据我所知，这可能是不可能的。
【问题讨论】：
标签： javascript html onload jquery
（应该是load，而不是onload 或onLoad。）
load 不会冒泡（根据img entry in the HTML5 spec，它是"simple event"，不会冒泡），所以不能与live 或delegate 一起使用，它们依赖于从元素冒泡到其祖先元素的事件。
您必须将其连接到各个 img 元素上（并且在设置它们的 src 之前这样做，否则您可能会错过它；并且永远记得留意 @ 987654333@ 以及）。 （是的，你真的可以错过它：浏览器不是单线程的，只是 JavaScript 主线程。如果你设置src 并且图像在缓存中或很快可用，浏览器可以触发事件。触发事件的方式是浏览器查看在触发事件时注册了哪些处理程序，并在 JavaScript 主线程返回给浏览器时将要调用的处理程序排队。如果没有处理程序已注册，它们没有排队，并且您永远不会收到回调。）
【讨论】：
.src，然后设置监听器。
src 并且图像在缓存中或很快可用，则浏览器可以触发该事件。它通过查看在事件触发时注册了哪些处理程序，并将这些处理程序排队以被调用。如果没有注册处理程序，它们不会排队等待回调，并且您会错过事件。我已经看到了它的发生，并帮助了这里至少几个人进行 SO 调试为什么他们没有收到事件。
load 不会冒泡，所以不能将它与委托一起使用。 jQuery's docs for on 也提到了这一点，并且（与 focus 不同）它并没有说 jQuery 会为您更新该行为。
它有点脏，但它有效：
<script type="text/javascript">
var loop = setInterval(function() {
// the img to watch
var $img = $("img.hi");
if( !!$img.length && $img[0].complete ) {
// clear the timer
clearInterval(loop);
alert("loaded !");
}
}, 30);
</script>
<img class="hi" src="http://www.google.fr/images/nav_logo72.png" />
【讨论】：
load (+ error) 是更好的方法，尤其是。因为如果图像没有加载，上述将永远循环。
最后我偶然发现了这个 jQuery 插件： https://github.com/desandro/imagesloaded
【讨论】：