文章/答案/技术大牛

发布

问新年倒计时
EN

Code Review用户

提问于 2015-01-01 05:22:46

回答 1查看 1.5K关注 0票数 4

下面是一些我快速编写的代码，以获得一个良好的毫秒倒计时。它显示新的一年前的毫秒数，无论2015年的时区是什么，都是大字体，然后在下面以小字体显示时区。

<!DOCTYPE html>
<html>
    <head>
        <title>Newyear Countdown</title>
        <style>
            h1 {
                font: 25vw "Helvetica Neue";
                margin: 0;
            }
        </style>
    </head>
    <body>
        <h1 id="countdown">Loading</h1>
        <p id="timezone">Loading</p>
        <script>
            var countdown = document.getElementById('countdown'),
                timezoneText = document.getElementById('timezone'),
                timezone = -12;
            setInterval(function() {
                countdown.removeChild(countdown.firstChild);
                var text = new Date('2015-01-01T00:00:00Z').getTime() + 3600000 * timezone - new Date().getTime();
                while (text < 0) text = new Date('2015-01-01T00:00:00Z').getTime() + 3600000 * ++timezone - new Date().getTime();
                countdown.appendChild(document.createTextNode(text));
                timezoneText.removeChild(timezoneText.firstChild);
                timezoneText.appendChild(document.createTextNode('Milliseconds until newyear 2015 in timezone UTC' + (timezone > 0 ? '+' : '') + (timezone || '')));
            }, 0);
        </script>
    </body>
</html>

javascript

html

datetime

timer

回答 1

Code Review用户

回答已采纳

发布于 2015-01-01 06:11:22

我想你把时区处理错了：

对于印度、尼泊尔、伊朗和纽芬兰等带有非整数偏移量的时区的居民来说，计时器是无用的。
你已经改变了UTC偏移量的意义。主子午线以东的时区一般应该有正偏移，而西边的时区则会有负偏移。
一两天后会发生什么？看起来，它将继续努力寻找一个时区，但这个时区的偏移量还没有达到2015年。

这里是本地时区计时器的实现(因为这是您最初在问题中指定的)。

<!DOCTYPE html>
<html>
    <head>
        <title>Newyear Countdown</title>
        <style>
            h1 {
                font: 25vw "Helvetica Neue";
                margin: 0;
            }
        </style>
    </head>
    <body>
        <h1 id="countdown">Loading</h1>
        <p id="timezone">Loading</p>
        <script>
            function formatTimezone(offsetMinutes) {
                if (offsetMinutes == 0) return 'UTC';
                var hours   = Math.floor(Math.abs(offsetMinutes / 60));
                var minutes = Math.round(Math.abs(offsetMinutes) % 60);
                var sign    = (offsetMinutes > 0) ? '+' : '-';
                return 'UTC' + sign +
                       ('00' + hours).slice(-2) +
                       ('00' + minutes).slice(-2);
            }

            function millisecondsUntil(target) {
                return target - Date.now();
            }

            var countdown = document.getElementById('countdown'),
                target = (new Date(2015, 0, 1)).getTime(),
                timezoneText = document.getElementById('timezone'),
                timezoneOffsetMinutes = -(new Date()).getTimezoneOffset();
          
            timezoneText.removeChild(timezoneText.firstChild);
            timezoneText.appendChild(document.createTextNode('Milliseconds until new year 2015 in timezone ' + formatTimezone(timezoneOffsetMinutes)));
          
            setInterval(function() {
                var text = millisecondsUntil(target);
                countdown.removeChild(countdown.firstChild);
                countdown.appendChild(document.createTextNode(text));
            }, 1);
        </script>
    </body>
</html>

票数 2

页面原文内容由Code Review提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://codereview.stackexchange.com/questions/75404

复制

相似问题

问新年倒计时
EN

回答 1

Code Review用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问新年倒计时EN

回答 1

Code Review用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问新年倒计时
EN