我在我的网站上使用此HTML:
<a href="#1" id="slick-toggle"><img src="img1.jpg"/></a>
当我点击此链接时,我想将图像src更改为img2.jpg
。再次点击时会恢复为img1.jpg
&amp;等等。 有人可以解释我是如何使用jQuery做的吗?
如果这有帮助,这是我现有的 jQuery :
$(document).ready(function() {
$('#slick-toggle').click(function() {
$('#slickbox').toggle(400);
return false;
});
});
非常感谢您提出的任何指示: - )
答案 0 :(得分:7)
$(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;
});
});
答案 1 :(得分:1)
你需要找到里面的图像,因为点击处理程序就在它上面,就像这样:
$('a#slick-toggle').click(function() {
var img = $('#share')[0], isSwap = "True";
img.src = isSwap ? img.src.replace("_img1","_img2") : img.src.replace("_img2","_img1");
$('.img-swap').toggleClass("on");
$('#atBox').toggle(100);
return false;
});
答案 2 :(得分:1)
使用此功能:
$('#mylink').toggle(
function(){
$(this).attr('src','img2.jpg');
},
function(){
$(this).attr('src','img3.jpg');
}
// and so on..
);
你可以在其中添加更多功能......