Множественный обратный отсчет с часовым поясом

Question

Мне нужно использовать Multiple Countdown на одной странице с часовым поясом. Я нашел 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>