如何在javascript中隐藏损坏的图像?

jpr*_*rim 16 html javascript

我在if语句中有我的图像:

if (item.image)
   historyHtml += '<a href=' + item.image + ' class="image" target="_blank"><img src="' + item.image +'" width="111px"/></a>';
Run Code Online (Sandbox Code Playgroud)

Pis*_*3.0 42

您可以使用onerror处理程序.在内联形式中,它看起来像这样:

<img src="someimage.jpg" onerror="this.style.display='none';" />
Run Code Online (Sandbox Code Playgroud)

  • @jprim:你没有正确地转义引号.试试这个:if(item.image)historyHtml + ='<a href='+ item.image +'class="image" target="_blank"> <img rel="nofollow noreferrer" src ="'+ item.image +'"width = "111px"onerror ="this.style.display = \'none \';" /> </A>" (3认同)
  • @jprim:"错误"令人讨厌地含糊不清.你试试这件事到底发生了什么? (2认同)

Pek*_*ica 8

正如@piskvor所说,实际上在img标签中加载图像是查明URL是否损坏的唯一方法.error如果加载失败,则会触发该事件.

但是看看你的代码,也许相反的方法最有意义:<a>默认隐藏,并onload在图像的情况下显示它.

简略:

<a href=".." id="image228" style="display: none">
 <img src="..." onload="this.parentNode.style.display = 'block'">
</a>
Run Code Online (Sandbox Code Playgroud)