JS倒计时网站时区问题

问题描述 投票:0回答:1

我不太喜欢我的网站设计中的 JS 内容,所以这是别人的倒计时器代码片段。

我遇到的问题是我希望倒计时是一个特定的时间点。假设太平洋标准时间 6 点为 2023 年 9 月 15 日。但是当我在纽约的朋友查看网站时,同一日期已设置为 6EST。

我需要这个时钟来为网站上的每个人显示此时为零的时间。

<script> 

(函数(){

var deadline = '2023/09/15 00:00';

function pad(num, size) {
    var s = "0" + num;
    return s.substr(s.length - size);
}

// fixes "Date.parse(date)" on safari
function parseDate(date) {
    const parsed = Date.parse(date);
    if (!isNaN(parsed)) return parsed
    return Date.parse(date.replace(/-/g, '/').replace(/[a-z]+/gi, ' '));
}

function getTimeRemaining(endtime) {
    let total = parseDate(endtime) - Date.parse(new Date())
    let seconds = Math.floor((total / 1000) % 60)
    let minutes = Math.floor((total / 1000 / 60) % 60)
    let hours = Math.floor((total / (1000 * 60 * 60)) % 24)
    let days = Math.floor(total / (1000 * 60 * 60 * 24))

    return { total, days, hours, minutes, seconds };
}

function clock(id, endtime) {
    let days = document.getElementById(id + '-days')
    let hours = document.getElementById(id + '-hours')
    let minutes = document.getElementById(id + '-minutes')
    let seconds = document.getElementById(id + '-seconds')

    var timeinterval = setInterval(function () {
        var time = getTimeRemaining(endtime);

        if (time.total <= 0) {
            clearInterval(timeinterval);
        } else {
            days.innerHTML = pad(time.days, 2);
            hours.innerHTML = pad(time.hours, 2);
            minutes.innerHTML = pad(time.minutes, 2);
            seconds.innerHTML = pad(time.seconds, 2);
        }
    }, 1000);
}

clock('js-clock', deadline);

})();

javascript clock webflow
1个回答
1
投票

您需要在日期字符串中的某个位置包含时区信息,例如

"2023-09-15T06:00:00.000-07:00"
表示下午 6 点,
"2023-09-15T18:00:00.000-07:00"
表示下午 6 点。 (太平洋标准时间 (PST) 比世界标准时间 (UTC) 晚 7 小时)。解析日期后,他们的浏览器将自动将时间视为其时区的时间(例如,下午 6 点,美国东部标准时间为晚上 9 点),允许秒/分钟/小时等。才能正确计算。

© www.soinside.com 2019 - 2024. All rights reserved.