首页 > 解决方案 > 如何在javascript setInterval函数中显示毫秒和秒

问题描述

如何在倒数计时器中显示毫秒和秒。

我已经设法使用以下代码添加秒数,但我不清楚如何在这里添加毫秒。

<div id="countdown"></div>

<script type="text/javascript">
var requiredTiming = [12.2, 5]


var counter = 0;
timingLooop(0);

function timingLooop(item) {
    
    var timeleft = requiredTiming[item];
    var downloadTimer = setInterval(function () {         
   if (timeleft > 0) {

            document.getElementById("countdown").innerHTML = timeleft  + " seconds remaining";
        }
        else {
            if (timeleft == 0 && counter <= requiredTiming.length) {
                counter++;
                clearInterval(timeleft);
                timingLooop(counter);

            }

        }
        timeleft -= 1;
    }, 1000);


}

标签: javascript

解决方案


这是工作解决方案:

<div id="timer"></div>
<button id="start" onclick="startFunc()">Start</button>

<script type="text/javascript">
var requiredTiming = [3, 5];

var counter = 0;
function startFunc() {
    clearInterval();
    counter = 0;
    timingLooop(0);
}
function timingLooop(item) {
    if (requiredTiming[item]) {
        var count = requiredTiming[item] * 1000;
        var start = new Date();
        var incounter = setInterval(timer, 1); //1000 will  run it every 1 second

        function timer() {
            var left = count - (new Date() - start);

            if (left <= 0) {
                counter++;
                clearInterval(incounter);
                timingLooop(counter);
                return;
            }
            else {
                document.getElementById("timer").innerHTML = msToTime(left) + " seconds"; // watch for spelling
            }

        }
    }
}

function msToTime(s) {
    var ms = s % 1000;
    s = (s - ms) / 1000;
    if (s && s > 0) {
        return s + ':' + pad(ms, 3);
    }
    else {
        return s;
    }
}

function pad(n, width, z) {
    z = z || '0';
    n = n + '';
    return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
}

推荐阅读