当Space被占用时，让我的1:5时钟停止

Make my 1:5 clock stop when Space is being hold

本文关键字：时钟 我的 Space      更新时间：2023-09-26

我创建了这个时钟，它应该在SPACE保持时暂停。但我的Js技术非常糟糕，所以我有点迷失了方向。时钟是1到5点钟。这意味着每过一秒，时钟就过5秒。

        var clock = new Clock("clock");
        clock.start();
        function Clock(id) {
            var clock = this;
            var timeout;
            var time;
            this.hours = 7;
            this.minutes = 10;
            this.seconds = 0;
            this.stop = stop;
            this.start = start;
            var isStarted = true;
function Click () {
if (isStarted) {
stop();
}
else
{
start();
}
}

            var element = document.getElementById(id);
            function stop() {
                clearTimeout(timeout);
            }
            function start() {
                timeout = setTimeout(tick, 0);
                time = Date.now();
            }
            function tick() {
                time += 1000;
                timeout = setTimeout(tick, time - Date.now());
                display();
                update();
            }
            function display() {
                var hours = clock.hours;
                var minutes = clock.minutes;
                var seconds = clock.seconds;
                hours = hours < 10 ? "0" + hours : "" + hours;
                minutes = minutes < 10 ? "0" + minutes : "" + minutes;
                seconds = seconds < 10 ? "0" + seconds : "" + seconds;
                element.innerHTML = hours + ":" + minutes + ":" + seconds;
            }
            function update() {
                var seconds = clock.seconds += 5;
                if (seconds === 60) {
                    clock.seconds = 0;
                    var minutes = ++clock.minutes;
                    if (minutes === 60) {
                        clock.minutes = 0;
                        var hours = ++clock.hours;
                        if (hours === 24) clock.hours = 0;
                    }
                }
            }
        }
  • 空格键：关键事件（可能是keypress，这是最好的）
  • 按住空格键的东西：没有按键，但有keydown和keyup
  • 暂停计时器：清除+重置或暂停标志

更新计时器/ticker，使其仅在未暂停时发出滴答声：

var paused = false;
function tick() {
    time += 1000;
    timeout = setTimeout(tick, time - Date.now());
    if ( !paused ) {
        display();
        update();
    }
}

然后设置paused标志：

document.onkeydown = function(e) {
    if ( e.keyCode == 32 ) {
        paused = true;
    }
}
document.onkeyup = function(e) {
    paused = true;
}

我不确定时间，因为您使用的是Date.now()和setTimeout，所以这可能会使它跳到onkeyup之后。我相信你能弄清楚那部分。这毕竟是你的代码。

您的"类"有一个非常奇怪的作用域，因此tick无法通过this访问对象属性。示例显示公用方法更改私有属性：http://jsfiddle.net/rudiedirkx/tej4pvm9/1/

如果你想创建一个类，你应该使用JS原型，所以this可以工作，并且你不会为每个实例重新定义新的私有方法：http://jsfiddle.net/rudiedirkx/tej4pvm9/2/

相关文章：