javascript - jQuery 图像 slider - 奇怪的行为

Question

我正在为 WordPress 网站创建一个图像 slider 。它仅部分起作用，它按预期呈现“显示”和“隐藏”行为，但不会切换 div 的“背景图像”CSS 属性。

图像链接在一个数组中，一个变量计数器在该数组的所有索引之间切换。使用“alert()”我能够确定它工作得很好(所有操作都正确执行)，但似乎蜜蜂工作得太快并导致溢出。我不确定它是否在每次运行时都以正确的顺序执行操作。你能帮帮我吗？

这是我从控制台得到的错误:

Uncaught RangeError: Maximum call stack size exceeded

这是我的 slider 代码:

jQuery( document ).ready(function($) {
    var imgArray = [];
    imgArray.push("url(/projekty/sklep/wp-content/themes/maxshop/images/rotate/drugi.jpg)");
    imgArray.push("url(/projekty/sklep/wp-content/themes/maxshop/images/rotate/trzeci.jpg)");
    imgArray.push("url(/projekty/sklep/wp-content/themes/maxshop/images/rotate/czwarty.jpg)");
    imgArray.push("url(/projekty/sklep/wp-content/themes/maxshop/images/rotate/piaty.jpg)");
    var i = 0;
    myWay(imgArray, i);


    function myWay(theArray, number) {
        $('#left-title-bar').show(500).delay(7000);
        $('#left-title-bar').css("background",""+ theArray[number] + "");
        $('#left-title-bar').hide(500);
        if (number==3) {
            number = 0;
        } else {
            number = number+1;
        }
        myWay(theArray, number);
    }
});

Answer 1

你的问题是你在没有条件终止的情况下使用递归， 在您的情况下，您根本不应该使用递归，而是尝试使用 setInterval(functionName, milliseconds) 。setInterval 将每 毫秒

调用一次 functionName

function myWay() { // make n and theArray in the outer scope of the function
    $('#left-title-bar').hide(500,function (){
        $('#left-title-bar').css("background",""+ theArray[number] + "");
        $('#left-title-bar').show(500);
        if (number==3) {
           number = 0;
        } else {
            number = number+1;
        }

    }); //delay will not pause the code
}
setInterval(myway,2000) //will run myway once each 2 seconds 

编辑:等图片变了再改