如果在setInterval中的语句只能工作一次

Question

我是Stack Overflow的新手，所以如果我完全做了一些我不应该做的事情，请让我知道，这样我就可以学习了。

无论如何！代码：

$(document).ready(function() {  
    var imgWidth = $(".window").width(); 
    var imgSize = $(".image_reel img").size(); 
    var imgReelWidth = imgWidth * imgSize; 


    $(".image_reel").css({ 
     width: imgReelWidth}); 

    var num = 960; 
    var numImgs = $('div.image_reel img').length; 
    var currentSlide = 0; 

    setInterval(function() {  
     currentSlide++; 

     if (currentSlide != numImgs) { 
      $(".image_reel").animate({ 
       left: -num 
      }, 1000); 
     } 
     else { 
      var setWidth = numImgs - 1; 
      var newSlideNum = num * setWidth; 
      $(".image_reel").animate({ 
       left: newSlideNum 
      }, 1000); 
      currentSlide = 0;  
     } 
    }, 2000); 
}); 

这段代码是应该做的（或至少我认为这是...）是一种通过if语句和2秒，它将循环后检查“当前幻灯片“等于图像的数量。现在，我使用alert函数进行了检查，看看所有的数字是否都是正确的，但是由于某种原因，滑块只能工作一次，就是这样。任何想法为什么？

在此先感谢你们。

Answer 1

这可能是你的问题：

var numImgs = $('div.image_reel img').length; 

这个拥有图像的数量在它叫，不叫它每一次的时刻。在你的代码替换numImgs与$('div.image_reel img').length，看看它的工作原理：

$(document).ready(function() { 
    var imgWidth = $(".window").width(); 
    var imgSize = $(".image_reel img").size(); 

    $(".image_reel").css('width', imgWidth * imgSize); 

    var num = 960; 
    var currentSlide = 0; 
    var setWidth = 0; 
    var newSlideNum = 0; 

    setInterval(function() { 
     currentSlide++; 

     if (currentSlide < $('div.image_reel img').length) { 
      $(".image_reel").animate({left: -num}, 1000); 
     } else { 
      setWidth = numImgs - 1; 
      newSlideNum = num * setWidth; 
      $(".image_reel").animate({left: newSlideNum}, 1000); 
      currentSlide = 0; 
     } 
    }, 2000); 
});