javascript - 使用 jQuery 单击后设置默认图像

Question

我只想在单击图像时看到新图像，并且在单击后我希望新图像更改为默认图像，但是我必须拖动鼠标才能看到默认图像，但我不希望那样。

这是我的代码：

$(document).ready(function(){
    $(".img-button").live('click', function () {
           $(this).attr("src","images/pressed.svg");
    }); 
});

Answer 1

如果你只有一张图片，我建议你给它一个 ID 而不是（ab）使用类名。如果您有多个并且全部使用相同的图像，则将下面的 $("#myImage") 更改为 $(".img-button")

切换

$(document).ready(function(){
    $("#myImage").toggle(
     function() {
       $(this).attr('src','images/pressed.jpg');
     },
     function() {
       $(this).attr('src',"images/default.jpg");
    });
});

离开后交换

$(document).ready(function(){
    $('#myImage').on("click",function() {
       $(this).attr('src','images/pressed.jpg');
    });
    $('#myImage').on("mouseleave",function() {
       $(this).attr('src',"images/default.jpg");
    });
});

按下后半秒交换

$(document).ready(function(){
    $('#myImage').on("click",function() {
       $(this).attr('src','images/pressed.jpg');
       setTimeout(function() {
         $('#myImage').attr('src',"images/default.jpg");
       },500);
    });
});