setInterval中的If语句只工作一次

If statement in setInterval only working once

本文关键字:一次 工作 中的 If 语句 setInterval      更新时间:2023-09-26

我是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语句并检查"当前幻灯片"是否等于图像的数量。现在我用警报功能检查是否所有的数字都是正确的,它们是正确的,但由于某些原因,滑动条只工作一次,仅此而已。知道为什么吗?

提前感谢各位。

这可能是你的问题:

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