时间:2021-05-21
问题描述
网站当中经常会遇到图片加载失败的问题,img中有地址,但是地址打开是错误的。情况如下:
不同浏览器处理错误图片是不一样的,有的干脆就显示差号,例如IE,有的显示一张破碎的图片,有的则是给一张高度比较大的默认图,例如PC端的火狐,IOS中Safari,还有安卓中的UC浏览器。这样在手机中就会导致左右两侧图片高度不一致!如下图:
解决方案
其实这里解决很简单,判断当图片加载失败的时候给一个默认图就可以了,不让浏览器使用其自带的默认图。
<img src="img/noimage2.png" onerror="javascript:this.src='img/noimage2.png';" alt="pic" />
衍生问题
因为图片加载失败进入默认图,那么默认图再加载失败怎么办呢?这不是进入一个死循环吗?
最简单的一个解决办法是,onerror中的图保证能打开,保证比较小!不会出现问题!。这个方法也是最有效的方法!
假如你不能保证,那么,只能靠函数来解决这个问题了!
思路是:
当图片加载失败,进入onerror的时候,判断onerror的图片是不是能加载,在onerror中的图片触发onerror的时候,设置onerror为null。
代码如下:
JavaScript Code复制内容到剪贴板声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
腾讯视频插件加载失败的原因及解决方法如下: 1、浏览器缓存过多。可以打开浏览器的设置界面,将缓存清除; 2、如果使用腾讯视频小程序时出现这种问题,可以进入微
浏览器的文件加载实际上是有非常纠结的兼容问题的。最近看到@lifesinger做了一个具体的总结。这里比较麻烦的是IE6~8不区分加载成功或失败,都走一个回调。
在javascript代码中,因为各浏览器之间的行为的差异,我们经常会在函数中包含了大量的if语句,以检查浏览器特性,解决不同浏览器的兼容问题。例如,我们最常见
做站时中因为不同的浏览器对样式的解析方法不一样,会造成了页面兼容问题。针对不同浏览器写不同css样式,每个人都知道有几种浏览器的市场份额比较多,可以说解决网
DOM2兼容处理顺序问题的解决方法,具体如下解决顺序问题:我们不用浏览器自带的事件池了,而是自己模拟标准浏览器的事件池实现,具体代码如下:/*bind:处理DO