javascript - setTimeout 计数器不工作

Question

这个 setTimeout 函数只运行一次然后停止。我没有收到任何错误，所以我不知道为什么会这样。

count = 100;

counter = setTimeout('timer()', 100);

$('#reset').click(function() {
    count = 100;
    counter = setTimeout('timer()', 100);
})

function timer() {
    if (count <= 0) {
        clearTimeout(counter);
        alert('done');
    }
    $('#counter').html(count);
    count -= 1;
}

我尝试了 setTimeout 函数的几种不同形式，包括setTimeout(timer(),100)和setTimeout(function() { timer() }, 100)

Answer 1

您应该使用setInterval()which 重复函数调用，而不是setTimeout()，它执行一次。另外，不要()在函数名引用中使用。

var count = 100;

var counter = setInterval('timer', 100);

$('#reset').click(function() {
    count = 100;
    counter = setInterval('timer', 100);
})

function timer() {
    if (count <= 0) {
        clearInterval(counter);
        alert('done');
    }
    $('#counter').html(count);
    count -= 1;
}

Answer 2

setTimeout工作正常，但它不是你要找的。试试吧setInterval。setInteval(function, delay)

Answer 3

setTimeout()-在等待指定的毫秒数后执行一次函数。

您可能希望setInterval()在指定的时间间隔内一遍又一遍地执行函数。

Answer 4

是的，就是setTimeout这样。它运行代码一次。

您想使用该setInterval方法重复运行代码。

Answer 5

不确定您要达到什么目的，而且我不理解$('#reset').click (etc) 构造。这些是 JQuery 吗？

但是，为什么不使用 setInterval()？然后在满足您的条件时清除间隔计时器？

Answer 6

var count = 10;

function counter() {

    if ( count > 0 )
    {
        --count;
        var t2 = setTimeout( counter, 1000 );

        document.querySelector("#demo").innerHTML = count;
    }
    else
    {
        clearTimeout(t2);

        document.querySelector("#demo").innerHTML = "Done";
    }
}

var countdown_timeout = counter();

<p>Count: <b><span id="demo"></span></b></p>