setTimeout 只运行一次？

Question

function slide()
{
    if($('.current').is(':last-child')){
        $('.current').removeClass('.current');
        $('#imgholder').first().addClass('.current');
        $('#imgholder').animate({left: '3920px'});
    }
    else{
        $nxt=$(".current");
        $(".current").removeClass("current");
        $nxt.next().addClass("current");
        $('#imgholder').animate({left: '-=980'},{duration: 'slow', easing: 'easeOutBounce' });
        }
}
var loop_handle= setTimeout("slide()",'3000');

我已将此代码放在标题部分中，并且 setTimeout 仅运行一次。

Answer 1

setTimeout应该只运行一次。 您正在寻找setInterval 。

var loop_handle = setInterval(slide, 3000);

此外，第二个参数应该是一个数字，而不是一个字符串。 当函数调用不需要任何参数时，最好引用函数而不是使用字符串。 一个字符串将被转换为一个函数。 该函数将在窗口范围内执行。

  setInterval("slide()", 3000);
//becomes
  setInterval(Function("slide();"), 3000);

Answer 2

是的，setTimeout 只运行一次。 你想要setInterval 。 此函数还返回一个 ID，您可以使用它来取消间隔。 例如：

const slideInterval = setInterval(slide, 3000);

// later...
clearInterval(slideInterval);

Answer 3

您正在寻找 setInterval

请参阅： https : //developer.mozilla.org/en/window.setInterval

Answer 4

setTimeout函数只运行一次！ 如果你想多次运行它，你应该使用setInterval ：

var loop_handle= setInterval("slide()",'3000');

您也可以在slide()函数的末尾使用setTimeout再次重新设置超时：

var loop_handle;
function slide() {
    if($('.current').is(':last-child')) {
        $('.current').removeClass('.current');
        $('#imgholder').first().addClass('.current');
        $('#imgholder').animate({left: '3920px'});
    }
    else {
        $nxt=$(".current");
        $(".current").removeClass("current");
        $nxt.next().addClass("current");
        $('#imgholder').animate({left: '-=980'},{duration: 'slow', easing: 'easeOutBounce' });
    }
    loop_handle = setTimeout("slide()",'3000');
}
loop_handle = setTimeout("slide()",'3000');

Answer 5

你只调用一次，所以它只会执行一次。

也许您正在考虑“setInterval()”。

顺便说一下，当您调用它时，只需传递函数的名称而不是字符串：

setInterval(slide, 3000);

Answer 6

将 setTimeout 与递归一起使用（无限循环）

如果您想在每个函数调用之间保持精确的空间，请使用setTimeout而不是 setInterval。 setInterval可以在某些时候重叠，这通常不是预期的行为。 这样你也可以和 coter 和 stopit if xondi

(function test(){
  setTimeout(function(){
    console.log(1);
    test();
  }, 2000)
})()

或者有条件使用；

// Declare recursive function
function test(runCount, runMax, waitBeforeRun){
  // ... do sometnig here
  console.log("runCount " + runCount);
  console.log("waitBeforeRun " + waitBeforeRun);

  // adjust your varibles in loop
  runCount++;
  let reduceWaitRunTimeBy = 99;
  waitBeforeRun = 0 > waitBeforeRun - reduceWaitRunTimeBy ? waitBeforeRun : waitBeforeRun -= reduceWaitRunTimeBy;
   
 /** Run recursion 
  *  if "if" condition will not make a return
  **/
  if(runCount > runMax) return;
     
  setTimeout(test.bind(null, runCount, runMax, waitBeforeRun), waitBeforeRun);
  
}

// Run Timeout
let runCount = 0;
let runMax = 30;
let waitBeforeRun = 2000;
setTimeout(test.bind(null, runCount, runMax, waitBeforeRun), waitBeforeRun);

在这里用我的代码笔试试

这将在您的控制台中输出：

"runCount 0"
"waitBeforeRun 2000"
"runCount 1"
"waitBeforeRun 1901"
"runCount 2"
"waitBeforeRun 1802"
"runCount 3"
"waitBeforeRun 1703"
"runCount 4"
"waitBeforeRun 1604"
"runCount 5"
"waitBeforeRun 1505"
"runCount 6"
"waitBeforeRun 1406"
"runCount 7"
"waitBeforeRun 1307"
"runCount 8"
"waitBeforeRun 1208"
"runCount 9"
"waitBeforeRun 1109"
"runCount 10"
"waitBeforeRun 1010"
"runCount 11"
"waitBeforeRun 911"
"runCount 12"
"waitBeforeRun 812"
"runCount 13"
"waitBeforeRun 713"
"runCount 14"
"waitBeforeRun 614"
"runCount 15"
"waitBeforeRun 515"
"runCount 16"
"waitBeforeRun 416"
"runCount 17"
"waitBeforeRun 317"
"runCount 18"
"waitBeforeRun 218"
"runCount 19"
"waitBeforeRun 119"
"runCount 20"
"waitBeforeRun 20"
"runCount 21"
"waitBeforeRun 20"
"runCount 22"
"waitBeforeRun 20"
"runCount 23"
"waitBeforeRun 20"
"runCount 24"
"waitBeforeRun 20"
"runCount 25"
"waitBeforeRun 20"
"runCount 26"
"waitBeforeRun 20"
"runCount 27"
"waitBeforeRun 20"
"runCount 28"
"waitBeforeRun 20"
"runCount 29"
"waitBeforeRun 20"
"runCount 30"
"waitBeforeRun 20"

或者在这里使用 OOP - Code Pen

Answer 7

那是因为setTimeout()应该只运行一次。 为了按设置的时间间隔触发事件，用户setInterval() 。

Answer 8

当您在递归循环中使用 setTimeout 时，通常会发生此问题，例如在 ajax 回调中，并且当您想从递归中运行某些内容时，您希望 setTimeout 像过去一样工作。 记住在非递归函数中使用 setInterval 。