点击时Jquery在几个图像之间切换

一旦你点击图像，我正在尝试使用jquery在三个图像之间切换。 点击第三张图像后，它会将其切换回第一张图片。

有没有办法调整以下内容以在两个以上的图片之间切换，并且它允许更多的切换一次？

jQuery的

$(document).ready(function() { $("#clickMe").click(function() { $("#myimage").attr({src : "picture2.png"}); }); }); 

HTML

谢谢。

Answer 1

这应该这样做：

 $(document).ready(function() { $("#clickMe").click(function() { var src = $('#myimage').attr('src'); //if the current image is picture1.png, change it to picture2.png if(src == 'picture1.png') { $("#myimage").attr("src","picture2.png"); //if the current image is picture2.png, change it to picture3.png } else if(src == "picture2.png") { $("#myimage").attr("src","picture2.png"); //if the current image is anything else, change it back to picture1.png } else { $("#myimage").attr("src","picture2.png"); } }); }); 

Answer 2

这有效：

 $(document).ready(function () { var i = 1; // Used to keep track of which image we're looking at $("#clickMe").click(function () { i = i < 3 ? i + 1 : 1; $("#myimage").html("picture#.png".replace("#", i)); }); }); 

在线演示： http ： //jsbin.com/afito

Answer 3

这是链接可能会有所帮助

http://www.sohtanaka.com/web-design/fancy-thumbnail-hover-effect-w-jquery/