多个时区还剩多天的JavaScript计时器

时间:2018-11-26 16:42:47

标签: javascript datetime

我要完成的任务是使用不同的到期日期进行多次倒计时。我有一个来自Codepen的代码段,我只是以一个倒计时作为起点。我也希望无论观众是在加利福尼亚州还是乔治亚州,到期都将知道时区是什么时间。我添加了建议的getTimezoneOffset()以处理不同的时区。这会导致倒数将剩余的天数乘以未来50年的荒谬数字。当我删除它时,这很好。因此,我还没有弄清楚如何正确实施该建议。经过多次尝试和错误,我确实成功创建了一个具有不同到期日期的重复倒计时。我唯一不了解的还是如何实现getTimezoneOffset(),以使其不显示17,893和17,883天(相当于50年的天数)。我是一个反复试验的javascript修饰符。我尝试一些东西,直到不再损坏为止。

var countDownDate = new Date("DEC 27, 2018").getTime();
var countDownDate2 = new Date("DEC 17, 2018").getTime();


// COPY FEED
var data = {
      // OFFER 1
      one:     "Offer One",
      two:     "Free Product",
    three:     "Today Only",
     // OFFER 2
     four:     "Offer Two",
     five:     "Free Pickup",
      six:     "<span id='daysLeft'></span> <span id='plural'></span>",
  seven:     "Expires: Dec. 27, 2018",
    // OFFER 3

    eight:     "Offer  Three",
    nine:     "<span id='daysLeft2'></span> <span id='plural2'></span>",

     ten:    "Expires: Dec. 17, 2018",
};

// LOOP THROUGH KEYS TO GET ALL ELEMENT IDs & CREATE VARIABLES
function bannerFunc() {
    for (key in data) {
        if (data.hasOwnProperty(key)) {
            var value = data[key];
            var key = document.getElementById('" + key + "');
        }
    }

    // ASSIGN OBJECT VALUES TO VARIABLES
      one.innerHTML = data.one;
      two.innerHTML = data.two;
    three.innerHTML = data.three;
     four.innerHTML = data.four;
     five.innerHTML = data.five;
      six.innerHTML = data.six;
    seven.innerHTML = data.seven;
    eight.innerHTML = data.eight;
     nine.innerHTML = data.nine;
     ten.innerHTML = data.ten;

    // DATE CODE


    var x = setInterval(function() {
        var now = new Date().getTimezoneOffset(),
            amountLeft = countDownDate - now,
            days = Math.floor(amountLeft / (1000 * 60 * 60 * 24) + 1),
            plural = document.getElementById('plural');
            plural.innerHTML = days + ' Days Left';
            if( days < 2 && days > 0 ){
                plural.innerHTML = days + ' Day Left';
            }
            if( days <= 0 ){
                plural.innerHTML = 'Expired';
            }


        var now = new Date().getTimezoneOffset(),
            amountLeft = countDownDate2 - now,
            days = Math.floor(amountLeft / (1000 * 60 * 60 * 24) + 1),
            plural = document.getElementById('plural2');
            plural2.innerHTML = days + ' Days Left';
            if( days < 2 && days > 0 ){
                plural2.innerHTML = days + ' Day Left';
            }
            if( days <= 0 ){
                plural2.innerHTML = 'Expired';

 }
    }, 1000);
}
bannerFunc();

1 个答案:

答案 0 :(得分:0)

使用getTimeZoneOffset进行日期计算。然后将所有日期定义为UTC日期。 (https://www.w3schools.com/jsref/jsref_gettimezoneoffset.asp)。 More about JS Dates