setTimeout() 函数运行无延迟答案

【问题标题】：setTimeout() function runs without delaysetTimeout() 函数运行无延迟
【发布时间】：2018-09-17 02:18:53
【问题描述】：

我有一个程序，其中一个 html 按钮调用一个 jQuery 函数（称为 funcOne）。该函数反过来调用一个递归函数（称为 funcTwo），它会更改 DOM 中的一些 CSS。 funcTwo 包含两个 setTimeout() 调用来延迟 CSS 更改，创建一种闪烁效果。

funcOne 看起来像这样：

function funcOne(stringOfNumbers){

    //This function does some other stuff that does not interfere with funcTwo
    someUnrelatedFunction(); 

    funcTwo(time);

    return;
}

funcTwo 看起来像这样：

function funcTwo(time){

    if(time == ""){return true;}

    var delay = time.charAt(0);
    var numDelay = parseInt(delay);

    setTimeout(function(){
        $("#container").css("background-color", "white");
        console.log("Changed to white");
    }, 1000); //Arbitrary delay

    setTimeout(function(){
        $("#container").css("background-color", "black");
        console.log("Changed to black");
    }, numDelay); //Variable delay

    time = time.substr(1);

    return funcTwo(time);

}

控制台显示两条消息，所以我知道脚本正在运行。我没有收到任何堆栈溢出错误。但是，两种延迟（任意延迟和可变延迟）都不会运行。 #container 立即变黑。

我做错了什么？非常感谢任何帮助。

【问题讨论】：

标签： javascript jquery css recursion settimeout

【解决方案1】：

我看到的一个问题是，在它变为黑色之前，您允许的最大延迟是 9 毫秒。由于您要给第二个变量延迟时间变量的第一个字符的值，最大的 1 个字符数是 9。如果您希望首先将背景颜色运行为白色，我会将第二个 setTimeout() 移动到内部第一个setTimeout() 允许它只准备在背景为白色后运行。 setTimeout() 已准备好，不会立即运行该函数。这允许在您的代码中，setTimeout() 之后的代码在函数实际运行之前运行。

【讨论】：

我注意到另一个问题：如果我在 func2 之后添加另一个不相关的函数（所以 func1 现在有 3 个函数调用），时间延迟再次被忽略。我应该如何解决这个问题？
虽然是这样，但背景应该在 1s 后变为白色
@nucleic550 你可以在 funcOne 中放置更多的 setTimeout 函数，或者在 funcTwo 中触发新的 setTimeout

【解决方案2】：

设置时间 setTimeout() 有两个参数，第一个参数是回调函数，第二个参数是 timeInterval，以毫秒为单位。因此，在您的情况下，您将其设置为 1000，即 1 秒。并在 1 秒后准确运行。

 setTimeout(function(){

        alert("Changed to white");
    }, 1000);

【讨论】：