使用jQuery，如何更改每个src的多个图像？

Question

我想使用jQuery更改图片的src，但图片不是一个。 多张图片。

请看我的代码。

第一张图片：

<a href="http://lh6.ggpht.com/-tW5eZaAemP8/UBZ_aT66SiI/AAAAAAAAZPM/CkVqrBISveU/s1600-h/IMGP3368%25255B2%25255D.jpg" target="_blank"><img style="display: inline" title="IMGP3368
No EXIF" alt="IMGP3368" src="http://lh5.ggpht.com/-WvsxW1qf94s/UBZ_bS1pT0I/AAAAAAAAZPU/FnSwggTLHQk/IMGP3368_thumb.jpg?imgmax=800" width="640" height="426"></a>

第二张图片：

<a href="http://lh5.ggpht.com/-RwcbVTWo_a0/UBZ_X08TWcI/AAAAAAAAZO8/-XHPCEmam68/s1600-h/IMGP3367%25255B2%25255D.jpg" target="_blank"><img style="display: inline" title="IMGP3367
No EXIF" alt="IMGP3367" src="http://lh3.ggpht.com/-FSuZrqMVwhY/UBZ_ZMMEjUI/AAAAAAAAZPE/HAb-ACKoO8A/IMGP3367_thumb.jpg?imgmax=800" width="640" height="426"></a>

和我的jQuery代码：

<script type="text/javascript">
$(document).ready(function() {
    $('.go_big').click(function(){
        var new_img = $('a[href*="ggpht.com"]').attr('href').replace('s1600-h','s1600')
        $('a[href*="ggpht.com"] > img').attr({src: new_img, width:'', height:''})
        });
});
</script>

如果单击“ .go_big”，请从“ A”标签加载href地址。 并更改“ a> img”的地址为“ A”标签的地址。 如何分别更改图像的地址？

感谢您的阅读。

（对不起，我的英语不太流利。）

Answer 1

使用.each()更新每个选定的图像：

$('a[href*="ggpht.com"]').each(function() {
    var new_img = $(this).attr('href').replace('s1600-h','s1600')
    $(this).find("img").attr({src: new_img, width:'', height:''});
}

Answer 2

您可以这样做。 您在链接上使用.each() 。 在.each()回调中，您获得href并计算新的href，然后找到该特定链接的子图像并将其设置为.src 。

<script type="text/javascript">
$(document).ready(function() {
    $('.go_big').click(function(){
        $('a[href*="ggpht.com"]').each(function() {
            var new_img = $(this).attr('href').replace('s1600-h','s1600');
            $(this).find("img").attr({src: new_img, width:'', height:''});
        });
    });
});
</script>

Answer 3

使用每个循环所有锚标记，并从那里获取新的图像链接。 现在在其中找到图像链接并更改其来源。 尝试这个

$(document).ready(function () {
    $('.go_big').click(function () {
        $('a[href*="ggpht.com"]').each(function (index, element) {
            var elm = $(this),
                new_img = elm.attr('href').replace('s1600-h', 's1600');
            elm.find('img').attr({
                src: new_img,
                width: '',
                height: ''
            })
        });
    });
});

Answer 4

尝试用我的代码替换您的代码。

<script type="text/javascript">
$(document).ready(function() {
    $('.go_big').click(function(){
        $('a[href*="ggpht.com"]').each(function(){
            var new_img = $(this).attr('href').replace('s1600-h','s1600');
            $(this).find('img').attr({src: new_img, width:'', height:''});
        });
    });
});
</script>