Question

我是一名学习Javascript的多媒体学生。

今天早上我有想法制作一个时钟的想法。是的我知道它已经在这个论坛上全天候完成，但不是我想要它，

我想要的东西：加载页面时，时钟从00:00:00开始（不是当前时间）。然后每一秒都来自等等。

到目前为止我得到的代码：

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8" />
        <title>Teller</title>
        <link rel="stylesheet" href="style.css">
        <script>
            var seconde;
            var minute;
            var hour;

            function ClockLoader() {
                seconde = setInterval(ClockTicker, 1000);
                minute = setInterval(ClockTicker, 60000);
                hour = setInterval(ClockTicker, 3600000);
            }
            function ClockTicker() {
                var nummer = document.getElementById("secondeClock").innerHTML;
                var nieuwNummer = document.getElementById("secondeClock").innerHTML + 1;
                document.getElementById("secondeClock").innerHTML = nummer.replace(nieuwNummer, "");

            }

            function stopTheClock() {
              clearInterval(seconde);
            }

            function startTheClock() {
                seconde = setInterval(ClockTicker, 1000);
                minuut = setInterval(ClockTicker, 60000);
                uur = setInterval(ClockTicker, 3600000);
            }
        </script>
    </head>

    <body onload="ClockLoader(); ClockTicker();">
        <div class="clock" id="hourClock">0</div>
        <div class="clock" id="minuteClock">0</div>
        <div class="clock" id="secondeClock">0</div>
        <button onclick="startTheClock();">Start</button>
        <br>
        <button onclick="stopTheClock();">Stop</button>
    </body>
</html>

我希望我所要求的不会占用你的大部分时间，提前谢谢！

Answer 1

与Alex K的评论一致，单个setInterval可以正常工作。

var sec=0,min=0,hour=0;
window.onload=function start() {
    setInterval(test,1000);
}
function test() {
    sec++;
    if(sec==60){
        sec=0;
        min++;
    }
    if(min==60){
        min=0;
        hour++
    }


}

由于setInterval(test,1000)设置为毫秒，1000毫秒= 1秒，我们只需在每次调用测试函数时添加一个。当60秒结束时，我们将分钟设置为1并重置第二个计数器。当分钟达到60时，我们将小时设置为1，依此类推。如果您计划制作24小时制或12小时制，我建议仍然使用此计数器，但也使用此方法：

var d = new Date(); 
initialhour=d.getHours(); 
initialminute=d.getMinutes(); 
initialsecond=d.getSeconds();

然后使用setInterval修改这些变量。也许使用另一个变量，所以上面只使用一次？希望这有帮助！

FIX：定义start()函数之外的变量。

Answer 2

我不确切地知道你在ClockTicker函数中想要做什么，但它没有做任何有用的事情。也许尝试这样的事情：

var nummer = document.getElementById("secondeClock").innerHTML;
var nieuwNummer = ++nummer;
document.getElementById("secondeClock").innerHTML = nieuwNummer;

使用setInterval排序时钟

2 个答案: