失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > img标签设置默认图片

img标签设置默认图片

时间:2020-07-17 09:37:48

相关推荐

img标签设置默认图片

场景:当获取图片路径或读取不到图片时,显示一张默认图片代替默认当图片碎片。

解决方法:利用img标签的onerror事件。

问题:如果defaultIcon也不存在,则会继续触发onerror事件,导致死循环,故会出现打开网页时提示Stack overflow at line: 0错误。特别说明:如果图片存在,但网络很不通畅,也可能触发 onerror事件。

解决方法:控制它不循环。

ps:按照网上的做法写onerror提示这个属性不存在,让我改成onError

更新:onerror 事件会在文档或图像加载过程中发生错误时被触发。在装载文档或图像的过程中如果发生了错误,就会调用该事件句柄。发生错误的前提是发起网络请求,即当srcundefinednull时不会触发,这种情况还需要另外去判断。

最终写法:

<imgsrc={logo||defaultIcon}alt="图标"onError={e => {// 替换的图片e.target.src = defaultIcon;// 控制不要一直触发错误e.onError = null;}}/>

如果觉得《img标签设置默认图片》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。