更改显示当前按钮的图像并将其他更改为默认值

Question

我有几个按钮：

<button class="image1-button"><img src="images/button_unselected.png"></button>
<button class="image1-button"><img src="images/button_unselected.png"></button>
<button class="image1-button"><img src="images/button_unselected.png"></button>
<button class="image1-button"><img src="images/button_unselected.png"></button>

当我按下其中一个时，会发生以下情况：

$(".image1-button").click(function(){
$(this).find("img").attr("src", "images/button_selected.png");
});

我怎么能说另一个，意味着没有（这个）得到src“images / button_unselected”总是只有当前按下的按钮有“button_selected”

谢谢你！

Answer 1

像这样：

$(".image1-button").click(function(){
    //Reset all
    $(".image1-button").find("img").attr("src", "images/button_unselected.png");
    //mark current
    $(this).find("img").attr("src", "images/button_selected.png");
});

Answer 2

$(".image1-button").click(function(){
  $(this).find("img").attr("src", "images/button_selected.png")
  $(this).siblings().find("img").attr("src", "images/button_unselected.png")
});