使用jQuery更改图片src onClick [英] Changing image src onClick with jQuery

问题描述

我正在我的网站上使用以下HTML: <a href="#1" id="slick-toggle"><img src="img1.jpg"/></a>

I am using this HTML on my site: <a href="#1" id="slick-toggle"><img src="img1.jpg"/></a>

当我单击此链接时，我想将图像src更改为img2.jpg.再次单击时返回到img1.jpg.很快. 有人可以解释我如何使用jQuery吗?

When I click this link, I would like to change the image src to img2.jpg. And revert back to img1.jpg when clicked again & so on. Can someone explain how I do this using jQuery?

如果有帮助，这是我现有的 jQuery :

Here is my existing jQuery if this helps:

$(document).ready(function() {     
  $('#slick-toggle').click(function() {
    $('#slickbox').toggle(400);
    return false;
  });
});

非常感谢您使用此指针:-)

Many thanks for any pointers with this :-)

推荐答案

$(document).ready(function() {     
  $('#slick-toggle').click(function() {
    $('img', this).attr('src', function(i, oldSrc) {
        return oldSrc == 'img1.jpg' ? 'img2.jpg' : 'img1.jpg';
    });
    $('#slickbox').toggle(400);
    return false;
  });
});

这篇关于使用jQuery更改图片src onClick的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！