setInterval中的if語句僅工作一次

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);
});

該代碼應該執行的操作（或至少我認為是...）是在2秒鍾后，它將循環遍歷if語句，並檢查“當前幻燈片”是否等於存在的圖像數量。 。 現在，我使用警報功能檢查了所有數字是否正確以及它們是否正確，但是由於某種原因，滑塊僅工作一次，僅此而已。 有什么想法嗎？

在此先感謝大家。

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);
});