html - Chrome - 找不到图像图标

Question

可能重复：
如何在找不到 src 源图像时静默隐藏“找不到图像”图标

有什么办法可以禁用未找到图像的默认图标？如果 src 给出 404，Chrome 会显示小图标。Firefox 不显示任何内容，我希望在 Chrome 中也一样。有什么解决办法吗？

Answer 1

<img onerror='this.style.display = "none"'>

或者

您可以使用onerrorJavaScript 中的事件在图像加载失败时采取行动：

var img = document.getElementById("myImg");
img.onerror = function () { 
    this.style.display = "none";
}

在 jQuery 中：

$("#myImg").error(function () { 
    $(this).hide(); 
});

或者对于所有图像：

$("img").error(function () { 
    $(this).hide();
    // or $(this).css({visibility:"hidden"}); 
});

如果隐藏图像可能会改变布局，您应该使用visibility: hidden而不是。.hide()Web 上的许多站点都使用默认的“无图像”图像，src当指定的图像位置不可用时，将属性指向该图像。

Answer 2

有一个使用 htaccess 的小解决方案。如果找不到图片，您必须重定向到 1x1 透明 png。唯一的缺点是，如果您明确定义图像的宽度和高度，图像仍将占据应有的位置。但什么都不会被看到。