代码之家 › 专栏 › 技术社区 › walter alexander

创建一个倒计时,剩余时间与国家相等

countdowntimer countdown datetime javascript

-1

walter alexander · 技术社区 · 8 年前

我可以想象有人已经做了这件事,也可以认为这是一个重复的问题,我已经搜索了几个星期,我不知道如何完成这件事。

我用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>

2 回复 | 直到 8 年前

skyboyer 8 年前

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

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>

tejzpr 8 年前

您可以使用来自 CDN 或使用 NPM

repl.it sample

const moment = require("moment-timezone");

function toTimeZone(time, offset) {
    var format = 'YYYY/MM/DD HH:mm:ss ZZ';
    return moment(time, format).utcOffset(offset).format(format);
}

toTimeZone("2018/04/10 15:37", "+0730")