Question

我正在为WordPress网站创建一个图像滑块。它只是部分工作，它按预期显示“显示”和“隐藏”行为，但它不会切换div的“背景图像”CSS属性。

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

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

Uncaught RangeError: Maximum call stack size exceeded

这是我的滑块代码：

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

调用一次milliseconds

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

编辑：在更改之前等待图片更改

jQuery图像滑块 - 奇怪的行为

1 个答案: