javascript - 使用 javascript 更改一组 标签的图像源(并再次返回)

Question

我有一组图像标签(大约 30 个)，我需要根据变量的值更改其源。

如何快速轻松地完成此操作，而无需为每个函数编写不同的函数？

显然我可以轻松地用类似的东西来改变每一个

$('#imagethatneedschanging').attr('src', 'alternateimage.png');

但是什么时候我怎样才能恢复到原始的 src 而无需为每个图像标签编写相反的内容？

Answer 1

首先，给它们一个类，以便您可以将所有图像作为一个组引用，而不是通过 ID 单独引用。

这个函数可以满足你的需要......

function setImageSrc(src) {
    $("img.yourClass").attr("src", function() {
        if (src == "") {
            return $(this).data("original-src");
        }
        else {
            $(this).data("original-src", this.src);
            return src;
        }
    });
}

然后您可以像这样调用它来设置所有图像...

setImageSrc("alternateimage.png");

这会将图像设置为显示替代图像，并在每个图像元素上存储原始 src 值。然后，您可以通过调用相同的函数将它们全部恢复为原始状态，但就像这样......

setImageSrc("");