javascript - 图片加载失败时，重试加载，如果重试加载不出来显示默认图片，不知道这样写对不对？高人指点一下-PHP中文网问答

文章专题 AI工具学习下载问答源码最近更新

PHP

会员中心讲师中心微信公众号

javascript - 图片加载失败时，重试加载，如果重试加载不出来显示默认图片，不知道这样写对不对？高人指点一下

伊谢尔伦 2017-04-10 15:24:41

[JavaScript讨论组]

485

<body>
   <img  id="img"  src="clock60.png"  retry="0" onerror="errorImg(this)" />

   <script>

   function errorImg(img) { 

     var retry= $('#img').attr("retry");
     if(retry>0)
     {
        $('#img').src="1.png";
     }
     else
     {
        retry = retry++;
        $('#img').attr("retry",retry);
        var sourceSrc=$('#img').src;
        $('#img').src=null;
        $('#img').src=sourceSrc;

     }
   </script>
</body>

伊谢尔伦

小伙看你根骨奇佳，潜力无限，来学PHP伐。

全部回复(2)

怪我咯2017-04-10 15:26:41 2楼

先贴出正确的做法：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="http://cdn.bootcss.com/jquery/2.1.0-beta3/jquery.min.js"></script>
</head>
<body>
<img id="img"  src="clock60.png"  retry="0" >
<script>
$(function() {
    $('#img').on('error', function() {
        var retry= $('#img').attr("retry");

        if (retry > 0) {
            $('#img').attr('src', 'https://iustudio.science/images/srpr/logo11w.png');
        } else {
            retry++;

            $('#img').attr("retry", retry);
            $('#img').attr('src', $('#img').attr('src'));
        }
    });
})   
</script>
</body>
</html>

你里面还有一个有点大的坑，就是这里：

retry = retry++;

其结果并没有实现加1，还是保留是原值 0.

另外还有jquery 和 js 操作原始dom想混淆的地方。

$('#img').src
要么 $('#img')[0].src
要么 $('#img').attr('src')

赞 +0

添加回复

黄舟2017-04-10 15:26:41 1楼

不知道你用的是不是jquery。
如果是jquery的话，设置属性值的应该是$("img").attr("src",sourceSrc);.你的语法我好像还没见过。。。

 function errorImg(img) { 

     var _this=$(img);
     var retry= _this.attr("retry");

     if(retry>0){
       _this.attr("src","1.png");
     }else{
        retry = retry++;
        _this.attr("retry",retry)
             .attr("src",_this.attr("src"));
     }
  }

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>