更改跨度内的日期以匹配用户的时区

Change dates inside span to match user's timezone

本文关键字:用户 时区 日期      更新时间:2023-09-26

我有这个功能:

function get_time_zone_offset() {   
    var current_date = new Date();   
    return -current_date.getTimezoneOffset() / 60; 
}

我想要一个 jQuery 代码将每个跨度的类是"timeago"标题值更改为其值加上上述函数返回的数字。例如:

以前:

<span class="timeago" title="7/4/2012 9:28:30 AM">7/4/2012 9:28:30 AM</span>

后:

<span class="timeago" title="7/4/2012 12:28:30 PM">7/4/2012 12:28:30 PM</span>

假设7/4/2012 9:28:30 AM表示UTC,你可以让Date对象做所有的数学运算:

function formatDate(d) {
    var yy = d.getFullYear();
    var mm = d.getMonth() + 1;
    var dd = d.getDate();
    var hh = d.getHours();
    var ii = d.getMinutes();
    var ss = d.getSeconds();
    var ap;
    if (hh < 12) {
        if (hh === 0) {
            hh = 12;
        }
        ap = "AM";
    }
    else {
        if (hh > 12) {
            hh -= 12;
        }
        ap = "PM";
    }
    return mm + "/" + dd + "/" + yy + " " + hh + ":" + ii + ":" + ss + " " + ap;
}
$("span.timeago").each(function() {
    var dateInput = $(this).text();
    var dateInUTC = new Date(dateInput + " +0000"); // note: +0000 is the key
    var dateOutput = formatDate(dateInUTC);
    $(this).attr("title", dateOutput).text(dateOutput);
});

这假定日期是可解析的。这是一个演示

似乎像这样的简单循环应该可以工作:

$('span.timeago').each(function(index, elm) {
    var newVal = $(elm).attr('title') * 1 + get_time_zone_offset(); // multiply by 1 to suppress string concatenation
    $(elm).attr('title', newVal);
});

通过将函数传递给.attr [docs] 非常简单:

var offset = get_time_zone_offset();
$('span.timeago').attr('title', function(i, val) {
    return +val + offset;
});

如果必须先将值转换为正确的时间戳,请查看如何使用 javascript 从日期转换为unix_timestamp。

如果您使用的是Timeago插件,请注意以下备注:

您是否担心时区支持?不要。时间哥也处理这个问题。只要您的时间戳采用ISO 8601格式并包含完整的时区指示符(±hhmm),无论您的访问者居住在哪个时区,一切都应该开箱即用。

因此,您甚至可能不必手动进行此转换。只需将正确的时区信息添加到值中即可。