jQuery在按钮按下时循环显示图像

Jones 发表于 Dev

琼斯

完全编码的新手要提前道歉，但是我要把这个问题扯掉了！

手头的任务

我试图让jQuery在无限循环中单击按钮时在一组图像之间循环。

到目前为止，我已经掌握了以下内容，但我在逻辑上找不到任何漏洞，但这似乎行不通。如果有人可以快速浏览一下，然后将其全部放入工作的jsfiddle中，我将非常感激！

      $(document).ready(function() { 
      $(“#button”).click(function() {

    var src = $('#myimage').attr('src');

    //if the current image is picture1.png, change it to picture2.png
    if(src == 'pic1.png') {
        $("#myimage").attr("src","pic2.png");

    //if the current image is picture2.png, change it to picture3.png 
    } else if(src == "pic2.png") {
        $("#myimage").attr("src","pic3.png"); 

    //if the current image is anything else, change it back to picture1.png
    } else {
        $("#myimage").attr("src","pic1.png");
    }
});

更新我想我的实际提琴琴可能做错了什么？https://jsfiddle.net/pj2wvcdx/

烟雾

这是一个工作示例。所有这些都基于您的代码，而我唯一更改的是您使用了错误的引号"#button"，但这可能是复制粘贴的东西？而且您没有关闭该click功能。

$(document).ready(function() { 
  $("#button").click(function() {
    var src = $('#myimage').attr('src');

    //if the current image is picture1.png, change it to picture2.png
    if(src == 'http://www.libpng.org/pub/png/PngSuite/f01n2c08.png') {
        $("#myimage").attr("src","http://www.libpng.org/pub/png/PngSuite/f02n2c08.png");

    //if the current image is picture2.png, change it to picture3.png 
    } else if(src == "http://www.libpng.org/pub/png/PngSuite/f02n2c08.png") {
        $("#myimage").attr("src","http://www.libpng.org/pub/png/PngSuite/f03n2c08.png"); 
    //if the current image is anything else, change it back to picture1.png
    } else {
        $("#myimage").attr("src","http://www.libpng.org/pub/png/PngSuite/f01n2c08.png");
    }
    console.log("Src is: " + $("#myimage").attr("src"));
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="button" >Cycle</button>
<img src="http://www.libpng.org/pub/png/PngSuite/f01n2c08.png" id="myimage"/>

您的代码段中的错误是您永远不会从1转到2。