【问题标题】：setTimeout runs only once?setTimeout 只运行一次？
【发布时间】：2011-12-13 14:58:06
【问题描述】：

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 只运行一次。

【问题讨论】：

每个答案都是正确的我在想 setInterval 哪个答案要批准？？？

标签： javascript settimeout

【解决方案1】：

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

var loop_handle = setInterval(slide, 3000);

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

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

【讨论】：

【解决方案2】：

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

const slideInterval = setInterval(slide, 3000);

// later...
clearInterval(slideInterval);

【讨论】：

【解决方案3】：

您正在寻找 setInterval

见：https://developer.mozilla.org/en/window.setInterval

【讨论】：

【解决方案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');

【讨论】：

酷。但是您可以这样做以获得更好的性能： var selector = $('#imgholder'); selector.dowhatever

【解决方案5】：

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

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

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

setInterval(slide, 3000);

【讨论】：

【解决方案6】：

使用 setTimeout 和递归（无限循环）

如果您想在每个函数调用之间保持准确的间隔，请使用 setTimeout 而不是 setInterval。 setInterval 可能会在某些时候重叠，这通常不是预期的行为。这样你也可以和 couter and 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);

用我的代码笔试试吧here

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

"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 here

【讨论】：

【解决方案7】：

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

【讨论】：

【解决方案8】：

这个问题通常发生在你在递归循环中使用 setTimeout 时，例如在 ajax 回调中，当你想在递归之外运行某些东西时，你希望 setTimeout 像过去一样工作。记得在非递归函数中使用 setInterval。

【讨论】：