如何在jQuery中交换图像

Question

当用户单击图片时，我该如何交换图片的SRC属性？

<a href="#">
    <img src="./layout/images/search.png" />
</a>

$('img[src="./layout/images/search.png"]').click(function () {
    $(this).attr('src',"./layout/images/search_select.png")
});

- user1065056

Answer 1

您可以尝试这个解决方案：

$("img").click(function(){
   $(this).attr("src","new.gif");
})

如David Hedlund所指出的那样，由于选择器的存在，这将更改页面上的所有图像。您可以像sam152建议的那样使用类来定位图像，或者您可以使用其src属性来定位图像。

 $("img[src='old.gif']").click(function (){
   $(this).attr("src","new.gif");
})

请查看我的演示- JSFiddle

- ipr101

---

@user1065056 - 你不明白什么？ - ipr101

@user1065056 - 你能在你的问题中发布你遇到问题的代码/标记吗？ - ipr101

@user1065056 我使用了你的代码建立了一个fiddle，看起来它确实可以工作 - http://jsfiddle.net/LBShe/ - ipr101

@user1065056 - 你所说的“permanent”是什么意思？交换只会持续到页面从服务器重新加载为止。 - ipr101

@user1065056 - 非常好，如果答案有帮助的话，我会非常感激您能接受它。谢谢 :) - ipr101

Answer 2

如果您有一个带有名为“swap”的类的图像，您可以使用以下代码片段。它使用点击事件，然后使用attr来更改图像的src属性。

$('.swap').click(function(){ 
    $(this).attr('src','new/path/to/img.jpg');
});

- Sam152

---

我也做了同样的事情，但是没有得到结果。 - user1065056