图片加载失败的处理方式

时间:2021-01-26 07:55:19

1.

前端展示数据的时候,有图片加载失败的时候,可以用img标签的 “onerror”属性,来指定 如果图片加载失败,那么就执行onerror属性里面的代码

比如Freemarker的写法

图片地址 = ${headHref}

<img src="${headHref}" onerror="this.src='<#if headHref!= ''>${headHref}<#else> ${basePath}/images/phone/pic.jpg</#if>'"/>

 

比如正常的HTML页面写法

<img src="https://www.baidu.com/23423.jpg" onerror="this.src='https://www.baidu.com/img/baidu_jgylogo3.gif'"/>