jquery - 如何在附加图像开始加载后立即运行 jQuery 代码？

Question

我将图像附加到这样的 div 中:

$('#content_div').append('<img src="/images/default_pic.jpg" />') 

发生这种情况时，会有轻微的延迟，然后图像开始加载。我想在轻微的延迟期间显示一个正在加载的 gif(在同一个 content_div 中)，然后一旦图像开始加载，该 gif 就会消失。我知道如何选择和删除正在加载的 gif，但是我应该将删除代码绑定(bind)到什么事件，以便在图像开始加载时运行它？

编辑:图片添加代码会运行多次，因此 content_div 最终会出现多个图片。

Answer 1

也许是这样的:

function showLoading() {
   ...
}

function hideLoading() {
   ...
}

...
showLoading();
$("<img>")
  .bind("load error", hideLoading)
  .attr("src", "/images/default_pic.jpg")
  .appendTo('#content_div');
...