html网页图片未加载完成或失败时显示默认图片 - 陌路人博客

html网页图片未加载完成或失败时显示默认图片-陌路人博客-第1张图片陌路人

陌路人博客(blog.imlr.cn)
用心传递快乐,初心不变。

html网页图片未加载完成或失败时显示默认图片


html网页图片未加载完成或因为失效显示失败时显示默认图片

一般一个内容多的网站相对会有比较多的图片文件,但是同时加载这些图片文件或加载失败时会出现空白占位,影响美观,通过脚本控制,可以实现加载需求内容图片时,加载未完成或失败的时候显示一张本地默认图片,加载完成显示内容本身自己的图片。

html网页图片未加载完成或失败时显示默认图片-陌路人博客- 第2张图片

教程:

首先在全局文件底部引入javascript

<script type="text/javascript"> 
    function imgerrorfun(){ 
        var img=event.srcElement; 
        img.src="图片地址"; //默认图片
        img.onerror=null; 
    } 
</script>
把最下面代码加到img标签src地址后面就行了!


<img src="xxxx" 代码加到这 />

onerror="imgerrorfun();"


至于代码放置位置只能自己找了,每个网站模板都不一样。


×

感谢您的支持,我们会一直保持!

html网页图片未加载完成或失败时显示默认图片-陌路人博客- 第4张图片
请土豪扫码随意打赏

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

打赏作者
版权所有,转载注意明处:陌路人博客 » html网页图片未加载完成或失败时显示默认图片
标签: 教程

发表评论

表情

网友评论(1)

老嫂子你是真的快
  3年前 (2022-04-19) 回复