更好的错误图片处理

Avatar of Chris Coyier
Chris Coyier on

找不到源的图片要么什么都不显示,要么显示一个 [ ? ] 样式的框。您可以将它替换为一个您确信存在的“图片丢失”图形,以便更好地直观地反馈出问题所在。或者,您可能想完全隐藏它。这是可能的,因为浏览器找不到的图片会触发一个我们可以监听的“错误” JavaScript 事件。

// Replace source
$('img').on("error", function() {
  $(this).attr('src', '/images/missing.png');
});

// Or, hide them
$("img").on("error", function() {
  $(this).hide();
});

此外,您可能希望触发某种 Ajax 操作,以便在发生这种情况时向网站管理员发送电子邮件。