Javascript时钟？

Question

我在PHP中获得GMT时间，我想像时钟一样计算。

<?php $time = gmdate('H:i:s'); ?>

<script>var time = <?php echo($time) ?>;
    setInterval(function() {
        time += 1;
        $("#timediv").text("Current time (GMT): " + time);
        //somehow convert it to 11:44:31 AM ??
    }, 1000);
</script>

seomeon可以帮帮我吗？

Answer 1

首先，依靠setTimeout / setInterval精度来显示时间并不是一个好主意。有多种原因使它们不那么准确，比如CPU减速。这就是为什么你应该使用Date对象，它使用实际的时钟。

当我想在客户端使用服务器的时间时，这就是我的工作：

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>

<!-- dateFormat plugin for nice and easy time formatting -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-dateFormat/1.0/jquery.dateFormat.min.js"></script>

<script>
    var clientTime = (new Date()).getTime(),
        serverTime = <?php echo time() ?> * 1000,
        difference = clientTime - serverTime;

    setInterval(function () {
        var now = new Date();

        now.setTime(now.getTime() - difference);

        $("#timediv").text("Current time (GMT): " + $.format.date(now, "hh:mm:ss a"));
    }, 1000);
</script>

它背后的关键概念是计算服务器时间和客户端时间之间的差异。然后，您将客户端（每次使用new Date()创建）标准化为差异。我们仍在使用setInterval，但即使由于某种原因它被延迟或加速，显示的时间仍然是正确的。

Answer 2

我不会遵循motanelu的回答，而是将其更改为：

<script>var time = Date.parse('<?php echo($time) ?>');
    setInterval(function() {
        time.setSeconds(time.getSeconds() + 1);
        $("#timediv").text("Current time (GMT): " + time);
        //somehow convert it to 11:44:31 AM ??
    }, 1000);
</script>

这会创建一个Date对象，您可以使用例如time.toLocaleTimeString();

进行格式化

Answer 3

替换

<?php $time = gmdate('H:i:s'); ?>

与

<?php $time = gmdate('h:i:s A'); ?>

Answer 4

谢谢你们，我做到了：

PHP：

$time = gmdate('H:i:s');
$time = preg_replace("/^([\d]{1,2})\:([\d]{2})$/", "00:$1:$2", $time);
sscanf($time, "%d:%d:%d", $hours, $minutes, $seconds);
$timeInSeconds = $hours * 3600 + $minutes * 60 + $seconds;

使用Javascript：

<script>
    function fromSeconds(sec){
        var d=new Date(0,0,0);
        d.setSeconds(+sec);
        return (d.getHours() ? d.getHours()+":" : "")+d.getMinutes()+":"+d.getSeconds();
    }

    var time = <?php echo($timeInSeconds) ?>;
    var newTime = 0;
    setInterval(function() {
        time += 1;
        var newTime = fromSeconds(time);
        $("#timediv").text("The current GMT time is: " + newTime);
    }, 1000);');
    ?>
</script>