如果在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); 
});