一尘不染

找不到src源图像时,如何静默隐藏“找不到图像”图标

html

您是否知道在 找不到 图像文件时如何从呈现的HTML页面中隐藏经典的 “未找到图像” 图标?

有使用JavaScript / jQuery / CSS的工作方法吗?


阅读 297

收藏
2020-05-10

共1个答案

一尘不染

您可以使用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()。网络上的许多站点都使用默认的“无图像”图像,src当指定的图像位置不可用时,将属性指向该图像。

2020-05-10