带时区的多个倒计时

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

确保导入 moment 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>

带时区的多个倒计时

Multiple Countdown with timezone

javascript

jquery

countdown