递归倒计时计时器

Recursive countdown timer

本文关键字：计时器 倒计时 递归      更新时间：2023-09-26

我正在尝试创建一个从25分钟开始到0结束的javascript计数器。其想法是在页面上显示分钟/秒作为倒计时时钟（我的目标div称为"txt"）。但我没有得到我想要的结果——计时器不会在每次运行函数时（每毫秒）进行减法运算。你知道我哪里错了吗？代码如下：

function countdown() {
    var target = 1500000; // 25 mins
    var current = 1000; // 0 secs
    for (var i=0; i<5; i++) {
        var diff = target-current;           // calculates the 25 minutes
        var min = Math.floor(diff/1000/60);  //gets mins
        var sec = (diff/1000) % 60;          // gets secs
        current = current+1000;
        document.getElementById("txt").innerHTML = min + ":" + sec;
        var t = setTimeout(countdown, 2500);}
    }
}

您需要在函数之外定义当前。目前，每次运行该函数时，您都会将其重置为1000。

到此为止：

var target = 1500000; // 25 mins
var current = 0; // 0 secs
function countdown() {
    current += 1000;
    var diff = target-current;           // calculates the 25 minutes
    var min = Math.floor(diff/1000/60);  //gets mins
    var sec = (diff/1000) % 60;          // gets secs
    document.getElementById("txt").innerHTML = min + ":" + sec;
    if (diff > 0)
        setTimeout(countdown, 1000);
}
countdown();

JSFiddle运行示例：https://jsfiddle.net/epcmw0uc/5/

相关文章：