Question

可能重复：
Javascript to run the Clock (date and time) 4 times speeder

我正在尝试制作一个以我提供的时间值（hh：mm：ss）开始的时钟，并以4倍的速度运行（对于运行4倍实际时间的在线游戏的服务器时间）。我修改了一个我在网上找到的免费时钟来做这个，但它只适用于其他每一分钟（尝试下面的代码，看看我的意思，如果这没有意义）。

var customClock = (function () {
    var timeDiff;
    var timeout;

    function addZ(n) {
        return (n < 10 ? '0' : '') + n;
    }

    function formatTime(d) {
        t1 = d.getHours();
        t2 = d.getMinutes();
        t3 = d.getSeconds() * 4;
        if (t3 > 59) {
            t3 = t3 - 60;
            t2 = t2 + 1;
        }
        if (t2 > 59) {
            t2 = t2 - 60;
            t1 = t1 + 1;
        }
        if (t1 > 23) {
            t1 = 0;
        }
        return addZ(t1) + ':' + addZ(t2) + ':' + addZ(t3);
    }

    return function (s) {
        var now = new Date();
        var then;

        var lag = 1015 - now.getMilliseconds();

        if (s) {
            s = s.split(':');
            then = new Date(now);
            then.setHours(+s[0], +s[1], +s[2], 0);
            timeDiff = now - then;
        }

        now = new Date(now - timeDiff);
        document.getElementById('clock').innerHTML = formatTime(now);
        timeout = setTimeout(customClock, lag);
    }
}());

window.onload = function () {
    customClock('00:00:00');
};

知道为什么会这样吗？我是Javascript的新手，这绝对是一个小黑客。感谢

Answer 1

我采用原始时间并从当前减去它然后将其乘以4并将其加到原始时间。我认为应该注意或同步问题。

(function(){
  var startTime = new Date(1987,08,13).valueOf() //save the date 13. august 1987
    , interval = setInterval(function() {
          var diff = Date.now() - startTime

          //multiply the diff by 4 and add to original time
          var time = new Date(startTime + (diff*4))

          console.log(time.toLocaleTimeString())
      }, 1000)
}())

如何使用自定义日期（使用Date对象）

Date(year, month, day, hours, minutes, seconds, milliseconds)

Answer 2

var lag = 1015 - now.getMilliseconds();试图在下一个时钟滴答之后“再次运行这个（15毫秒）”。将此值设置得更小（除以4？），此代码将更频繁地运行。

接下来，让它显示当前时钟持续时间的4倍。类似的问题：在formatTime（）

之内或之外将现在的细节乘以4

Answer 3

我首先要创建一个Clock构造函数，如下所示：

function Clock(id) {
    var clock = this;
    var timeout;
    var time;

    this.hours = 0;
    this.minutes = 0;
    this.seconds = 0;
    this.stop = stop;
    this.start = 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 += 4;

        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;
            }
        }
    }
}

然后你可以创建一个时钟并像这样启动它：

var clock = new Clock("clock");
clock.start();

以下是演示：http://jsfiddle.net/Nt5XN/

以4倍速运行Javascript时钟

3 个答案: