图片加载失败显示默认图片


情景分析:

有时候因为图片资源问题或网络问题导致图片加载不出来,原先位置就会出现一个碎片图标,这样会显得不太美观

解决思路:

利用img标签的onerror事件,img标签支持onerror 事件,在装载文档或图像的过程中如果发生了错误,就会触发onerror事件。可以使用一张提示错误的图片代替显示不了的图片

 1 <img src="images/logo.png" onerror="javascript:this.src='images/logoError.png';"> 

代码分析:

javascript:this.src=    固定内容

引号中写默认图片路径

ps:可能会出现的情况

如果默认图片也不存在或者是图片存在但网络条件不好,会继续触发onerror事件,这样就会陷入死循环

解决办法:

1 
8 
9 

参考链接:https://www.cnblogs.com/willingtolove/p/9544576.html