javascript - 创建一个倒计时，无论在哪个国家，剩余时间都是相等的

Question

我可以想象有人已经这样做了，或者它可以被认为是一个重复的问题，我已经搜索了数周，但我不知道如何实现这一点。

我有一个用js制作的倒计时，我面临的问题是，当我在另一个国家测试它时，时间会抛出不同的时间示例。

我在中美洲，结束日期是 2018 年 4 月 16 日 23:59:59”如果我在中美洲测试它，它会显示还剩 6 天零 10 小时，如果我在意大利运行它，它会显示 6 天和还剩 3 小时，我需要它始终相等并且时区不影响，这是否可能，请帮助了解如何完成它。

我的脚本正在工作，但不是我需要的方式，我有一个促销将于“2018 年 4 月 16 日 23:59:59”到期，所以如果它只剩下 5 小时，它会喊说还剩下 5 小时无论从哪里看到，但这都没有发生。

$("#masterslider").append("<p id='demo'>.</p>")
  $("#masterslider").append("<span> remaining time  </span>")

//******************************** update date here ************************
var serverDate = new Date("apr 16, 2018 23:59:59");
var offset = serverDate.getTimezoneOffset();
serverDate = addOffset(serverDate, offset);

 setInterval(function(){
    updateCountdown();
}, 1000);

 function addOffset(date, offset) {
    var time = date.getTime() ;
 return new Date(time + offset  * 6000);
}

 function updateCountdown() {
 var userDate = new Date();

    var distance = serverDate.getTime() - userDate.getTime();

    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
   //var seconds = Math.floor((distance % (1000 * 60)) / 1000);


  if(serverDate.getTime()  > userDate.getTime()){

       $('#demo').html( days +"day(s)"+ " / " + hours + "hour(s)"  + minutes + "minutes(s)");

  }
   else 
  {
   $("#demo").html(mas); 
   $("#masterslider span").hide();
 }


 }
 </script>

Answer 1

我已经检查并为“事件时间戳”设置正确的时区，无论我使用什么本地客户端时区，都适用。

let targetDate = new Date("2018-04-11 23:59:59 GMT-0800");
let refreshDelayMs = 1000;
function updateCounter() {
   let distance = (targetDate - new Date()) / 1000;
   let seconds = Math.floor(distance % 60).toString().padStart(2, '0');
   distance = distance / 60;
   let minutes = Math.floor(distance % 60).toString().padStart(2, '0');
   distance = distance / 60;
   let hours = Math.floor(distance % 24).toString().padStart(2, '0');
   let days = Math.floor(distance / 24).toString().padStart(2, '0');
   document.querySelector('.counter').innerHTML = `${days} days ${hours}:${minutes}:${seconds}`;
   setTimeout(updateCounter, refreshDelayMs);
}

updateCounter();

Remains: <span class="counter"></span>