在img标签上尽量不要使用onerror事件

在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来更换图片

 

转载于:https://www.cnblogs.com/agansj/p/7811532.html