Javascript 要在悬停时更改img src，然后在单击时更改为其他src吗

我有一个包含img的div-我希望能够在悬停时更改img src（然后在未悬停时再次更改），但在单击时也可以将相同的img更改为不同的src（然后在第二次单击时再次更改）。到目前为止，我有一个J-Query代码，可以在悬停时进行更改：

HTML

但是我不确定如果点击的话，如何对一个不同的src进行修改（因为图片必须悬停在上面才能点击！）有人建议吗？出于各种重新调整大小的原因，我希望将图像保留为div中的独立图像，而不是将其作为div的背景图像，如果可能的话，可以使用Jquery的.hover（）和.click（）函数。您所使用的有语法问题

以下是正确的代码：

$('#img1').hover(function () {
    $(this).attr('src', 'http://www.fateheducation.com/fatehnew/Testimonial_Image/avatar-small.png');
});
$('#img1').click(function () {
    $(this).attr('src', 'http://moduleoff.com/sites/all/themes/moduleoff/images/xdruplicon_rotated_small.png.pagespeed.ic.Xl8nCuL4lR.png')
});

---

只需使用

.on（'hover'，function（）

和

。on（'click'，function（）

），只需执行

$（'img1'）。off（）

或

$（'img1'）。off（'hover'）

，一旦在屏幕上单击图像以获得建议，您是否能够提供一个js小提琴来显示您在操作中的意思？

$(document).ready(function(){$('#img1').hover(function(){$(this).attr('src','tabt2.png')},function()
{$(this).attr('src','tab.png')}) });

$('#img1').hover(function () {
    $(this).attr('src', 'http://www.fateheducation.com/fatehnew/Testimonial_Image/avatar-small.png');
});
$('#img1').click(function () {
    $(this).attr('src', 'http://moduleoff.com/sites/all/themes/moduleoff/images/xdruplicon_rotated_small.png.pagespeed.ic.Xl8nCuL4lR.png')
});