更改所有图像源jquery

4

如果图片加载失败,我希望能够更改所有的图像源。由于一些公司阻止访问Dropbox,因此我想使用替代链接来获取图像。此外,我不想修改图像和CSS文件。我的代码可以处理第一张图片,但会将每个图像源都变成相同的。我该如何解决这个问题?谢谢!

<html>
<head>
<script src="jquery.js" type="text/javascript"></script>

</head>
<body>

<img  src="img/a.png" alt="img1"/>
 <img  src="img/b.png" alt="img2"/>

</body>

<script>

var image = new Image();
image.src = "http://dropbox.com/favicon.ico";
if (image.height < 0) {

var imgsrc = $('img').attr('src');

var imgsrc1 = imgsrc.substr(imgsrc.lastIndexOf("img/"));
imgsrc1 = imgsrc.substr(4);
var imgalt = imgsrc1.substr(4,imgsrc.length - 4);

var imgsrc2 ='t/' + imgsrc1;
$('img').attr('src',imgsrc2);
$('img').attr('alt',imgalt);    

    } else {


var imgsrc = $('img').attr('src');

var imgsrc1 = imgsrc.substr(imgsrc.lastIndexOf("img/"));
imgsrc1 = imgsrc.substr(4);
var imgalt = imgsrc1.substr(4,imgsrc.length - 4);

var imgsrc2 ='http://dl.dropbox.com/u/xxxxxx/img/' + imgsrc1;
$('img').attr('src',imgsrc2);
$('img').attr('alt',imgalt);    

    }
</script>
</html>
2个回答

7

您需要对所有图片执行相同的操作,我认为您的代码仅适用于第一个图片。具体来说,这行代码 var imgsrc = $('img').attr('src');

请在else子句内尝试以下内容:

$('img').each(function() {
     var $img = $(this);
     var imgsrc = $img.attr('src');

     var imgsrc1 = imgsrc.substr(imgsrc.lastIndexOf("img/"));
     imgsrc1     = imgsrc.substr(4);
     var imgalt  = imgsrc1.substr(4,imgsrc.length - 4);

     var imgsrc2 ='http://dl.dropbox.com/u/xxxxxx/img/' + imgsrc1;
     $img.attr('src',imgsrc2);
     $img.attr('alt',imgalt);
}

值得注意的是,Dropbox 每天有一定的传输带宽限制(不确定每天最多传输次数限制是否存在):https://www.dropbox.com/help/45


Christoffer,我之前尝试过使用for each,但是整个代码就停止工作了。不过还是谢谢你的帮助。 - john206

0

试试这个:

$(document).ready(function(){
    $('img').each(function(){

        var imgsrc = $(this).attr('src');

        $(this).load(function(){
            if( $(this).prop('complete') ){

                var imgsrc1 = imgsrc.substr(imgsrc.lastIndexOf("img/"));
                imgsrc1 = imgsrc.substr(4);
                var imgalt = imgsrc1.substr(4,imgsrc.length - 4);

                var imgsrc2 ='t/' + imgsrc1;
                $('img').attr('src',imgsrc2);
                $('img').attr('alt',imgalt);

            }else{

                var imgsrc1 = imgsrc.substr(imgsrc.lastIndexOf("img/"));
                imgsrc1 = imgsrc.substr(4);
                var imgalt = imgsrc1.substr(4,imgsrc.length - 4);

                var imgsrc2 ='http://dl.dropbox.com/u/xxxxxx/img/' + imgsrc1;
                $('img').attr('src',imgsrc2);
                $('img').attr('alt',imgalt);

            }
        });
    }
});

Sagar,我使用了你的代码,所有图像都变成了第二张图片,页面不停止加载。还是谢谢你的尝试。 - john206

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接