在img标签上尽量不要使用onerror事件
2024-08-30 15:39:35
在img标签上尽量不要使用onerror事件
因为在之前的时候,我在本地对用户头像修改发现,如果图片加载失败, 使用onerror事件去获取一个默认地址的图片虽然这是可行的,但是如果刚好onerror去获取的图片也不在,那么就会一直触发onerror事件,这个标签一直在请求一个不存在的图片。也就是会一直循环请求。
如果必须使用的话,就使用js的Image对象获取这个图片的信息,判断一些属性是否正常,如果正常就使用这个图片作为默认图片,不正常则不显示。、
<img src="a.jpg" onerror="imgExists(this)" alt="">
<script>
function imgExists(e){
//默认图片
var imgUrl = "https://account.acgxt.com/public/images/default.png";
var img = new Image();
img.src=imgUrl;
//判断图片大小是否大于0 或者 图片高度与宽度都大于0
if(img.filesize>0||(img.width>0&&img.height>0)){
e.src = imgUrl;
}else{
//默认图片也不存在的时候
}
}
</script>
也可以使用XMLHTTP远程判断图片是否存在。然后根据远程获取的是404还是200来更换图片
最新文章
- C#字符串的不变性
- MySQL中的外键是什么、有什么作用
- html练习
- <;构建之法>;第十一章、十二章有感
- 《linux内核设计与实现》读书笔记第三章
- ViewGroup 和 View 事件传递及处理小谈
- 组合方法(ensemble method) 与adaboost提升方法
- TP复习7
- Splash and Wizard
- OAuth2集成——《跟我学Shiro》
- linux下so动态库一些不为人知的秘密 系列
- laravel5验证码
- 车大棒浅谈for循环+canvas实现黑客帝国矩形阵
- phalcon——验证
- 18、Cocos2dx 3.0游戏开发找小三之cocos2d-x,请问你是怎么调度的咩
- Java 多线程 死锁 隐性死锁 数据竞争 恶性数据竞争 错误解决深入分析 全方向举例
- ADO.NET中COMMAND对象的ExecuteNonQuery、ExcuteReader和ExecuteScalar方法
- 《剑指offer》总结三 之二叉树(2)
- 【Gym 100947I】What a Mess
- 跟随我在oracle学习php(7)