我是 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 语句并检查“当前幻灯片”是否等于图像有。现在我检查了警报功能,看看所有数字是否正确,确实如此,但由于某种原因, slider 只工作一次,仅此而已。有什么想法吗?
提前谢谢大家。
最佳答案
这可能是您的问题:
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);
});
关于javascript - setInterval 中的 if 语句仅工作一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5612382/