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

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

  •  -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 年前
        1
  •  1
  •   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>
        2
  •  0
  •   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")