带时区的多重倒计时

Question

我需要在具有时区的单个页面中使用多重倒计时。我发现Final Countdown

我找到了我需要的代码。但无法使其在正确的时区工作。

    $(function(){
 $('[data-countdown]').each(function() {
   var $this = $(this), finalDate = $(this).data('countdown');
   $this.countdown(finalDate, function(event) {
     $this.html(event.strftime('%H:%M:%S'));
   });
 });
});

这用于多次倒计时，效果很好。。

此是针对具有单个倒计时的时区。

var nextYear = moment.tz("2020-05-29 00:00", "America/Sao_Paulo");

$('#clock').countdown(nextYear.toDate(), function(event) {
  $(this).html(event.strftime('%D days %H:%M:%S'));
});

我如何在适当的时区获得第一个作品。非常感谢

Answer 1

只需使用时刻时区功能将带有时区的日期传递到每个倒数计时。

这是您要寻找的？

$(function(){
    $('[data-countdown]').each(function() {
        var $this = $(this), finalDate = $(this).data('countdown');
        $this.countdown(moment.tz(finalDate, "America/Sao_Paulo").toDate(), function(event) {
            $this.html(event.strftime('%H:%M:%S'));
        });
    });
});

要获取用户本地时区，可以尝试

console.log(Intl.DateTimeFormat().resolvedOptions().timeZone); // America/Sao_Paulo
//or with moment
console.log(moment.tz.guess()) // America/Sao_Paulo

请确保您导入一下CDN库

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.26.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.31/moment-timezone.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.31/moment-timezone-with-data.min.js"></script>