javascript - JQuery 脚本错误

Question

我用 JQuery 开发了下面的图像更改器(mutator):

var images = [];
images[0] = "image1.jpg";
images[1] = "image2.jpg";

var i = 0;
setInterval(fadeDivs, 3000);

function fadeDivs() {
    i = i < images.length ? i : 0;
    $('.slideshow-right-corner img').fadeOut(100, function(){
        $(this).attr('src', images[i]).fadeIn(100);
    })
    i++;
}

由于某种原因，它在本地工作正常，但是当我与我的网站集成时，它对于数组中的第一个图像工作正常并停止工作。以下是我检查元素时收到的错误:

Uncaught TypeError: undefined is not a function (index):398 (anonymous function) (index):398 E.complete jquery-1.3.2.min.js?ver=3.4.1:19 o.fx.step jquery-1.3.2.min.js?ver=3.4.1:19 F jquery-1.3.2.min.js?ver=3.4.1:19 (anonymous function)

Answer 1

问题是多线程。 i++ 将在 fadeOut 函数之前进行计算。

因此，当 i=2 images[2] 将返回 undefined 并且程序将停止工作。

淡入后，尝试将 i++ 移动到函数内部。

这是更新后的代码(经过测试):

function fadeDivs() {
   i = i < images.length ? i : 0;
   $('.slideshow-right-corner img').fadeOut(100, function() {
   $(this).attr('src', images[i]).fadeIn(100);
   i++;
});