0

可能重复:
运行时钟(日期和时间)的 Javascript 速度提高了 4 倍

我正在尝试制作一个时钟,该时钟以我提供的时间值 (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 很陌生,这绝对是一个小技巧。谢谢

4

3 回答 3

2

我取原始时间并从当前时间中减去它,然后将其乘以 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)

于 2013-01-21T02:25:21.760 回答
0

var lag = 1015 - now.getMilliseconds();正在尝试“在下一个时钟滴答后再次运行一次(15 毫秒)”。使这个值更小(除以 4?),这段代码会更频繁地运行。

接下来,让它显示当前时钟持续时间的 4 倍。类似的问题:在 formatTime() 内部或外部将 now 的详细信息乘以 4

于 2013-01-21T02:14:22.367 回答
0

我将首先创建一个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/

于 2013-01-21T02:44:58.913 回答