Question

我正在尝试为html / js秒表添加功能，但我遇到了setTimeout（）函数的问题。为什么它只对我执行一次，但是在这个视频中：

https://www.youtube.com/watch?annotation_id=annotation_3059475893&feature=iv&src_vid=iSLWtGAw1Ic&v=gpFPppFU8s8

执行直到有人停止它为止。是的，我知道我可以使用setInterval，但我只是好奇。

这是我的代码：

let running = false;
let time = 0;

function start() {
    running = true;
    timer();
}

function stop() {
    running = false;
}

function reset() {
    running = false;
    time = 0;
    document.getElementById("stw").innerHTML = "00:00:00";
}
function timer() {
    if (running) {
        setTimeout(function() {
            time++;
            let min = Math.floor(time / 100 / 60);
            let sec = Math.floor(time / 100) % 60;
            let mSec = time % 100;

            if (min < 10) {
                min = "0" + min;
            }
            if (sec < 10) {
                sec = "0" + sec;
            }
            if (mSec < 10) {
                mSec = "0" + mSec;
            }
            document.getElementById("stw").innerHTML =
                min + ":" + sec + ":" + mSec;
        }, 10);
    }
}

Answer 1

在视频中（约2分钟），timer()递归调用自身。你的代码没有。

Answer 2

setTimeout()只调用一次回调函数。

有两种方法可以多次调用它：

使用setInterval()
使用递归函数反复重启setTimeout()。

示例：

function timer() {
  // do something

  // call this function again in 10 milliseconds
  setTimeout(timer, 10);
}

Answer 3

当您使用setTimeout()创建循环时，在函数setTimeout()调用中，您必须再次调用const loopFunc = () => { console.log('loop'); setTimeout(loopFunc, 1000); }; loopFunc(); // kick it off。

这是一个基本的循环函数：

＆＃13;

.vs

＆＃13;

setTimeout（）执行了多次？

3 个答案: