在客户端显示用户时区的日期/时间

Question

我有一个网络应用程序，可以在每个页面上显示日期时间戳，例如：

2009 年 12 月 12 日下午 6:00

我想动态检测用户的时区并使用 JavaScript 更改显示。

所以纽约用户会看到：

2009 年 12 月 12 日下午 6:00

加州用户会看到：

2009 年 12 月 12 日下午 3:00

有什么建议吗？

Answer 1

您可以使用 Date.getTimeZoneOffset() 获取与 GMT 的本地偏移量。

var date = new Date();
var offset = date.getTimezoneOffset();

从那里开始就是 SMOP。 使用 Javascript Date 对象，您可以调用

date.toDateString

来获取人类可读的日期。 如果您需要服务器端，请让 Javascript 使用 GET 或 POST 将偏移量发送到您的服务器。

格式化日期是另一回事。 Javascript 没有提供太多内置功能。你可以自己修改它，但这样就会出现错误和疯狂。 任何优秀的 Javascript 库都应该提供日期格式设置。 例如，JQuery 有 Datepicker.formatDate。

Answer 2

以下是如何使用精彩的“渐进增强”来做到这一点：

输出您希望其出现的日期，但请务必指定其时区（我在这里使用 GMT，但您可以使用 UTC 等）。然后将其与加载时的本地时间交换（如果提供了原始时区，则由 JavaScript 自动处理）。

<div id="timestamp">December 12, 2009 6:00 pm GMT</div>
<script type="text/javascript">
    var timestamp = document.getElementById('timestamp'),
        t         = new Date(timestamp.innerHTML),
        hours     = t.getHours(), 
        min       = t.getMinutes() + '', 
        pm        = false,
        months    = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];

    if(hours > 11){
       hours = hours - 12;
       pm = true;
    }

    if(hours == 0) hours = 12;
    if(min.length == 1) min = '0' + min;

    timestamp.innerHTML = months[t.getMonth()] + ' ' + t.getDate() + ', ' + t.getFullYear() + ' ' + hours + ':' + min + ' ' + (pm ? 'pm' : 'am');
</script>

Answer 3

我知道你很久以前就问过这个问题，但这对我来说似乎是一个常见的要求，我也遇到了同样的问题。我遵循了很多不同的参考资料，但从未找到像我现在使用的那样简单的解决方案。 我的服务器使用 MySQL 并以 UTC 格式存储 D&T（当然！）。因此，从数据库中出来的 D&T 看起来像

YYYY-MM-DD HH:MM:SS

，我希望用户以本地格式查看他们的本地时间！

这是我的解决方案 - 将 MySQL D&T 字符串包装在这两个函数之一中，以获取用户本地格式、用户本地时间的 D&T 或仅日期。

function local_dt(date_time)
{
    d = new Date(date_time+" UTC");
    return d.toLocaleString();
}

function local_date(date_time)
{
    d = new Date(date_time+" UTC");
    return d.toLocaleDateString();
}

其中

date_time

参数是来自MySQL的字符串，例如

console.log(local_date(user.created_dt));

对我有用。

我尝试将其全部放入一行，例如

Date("2022-06-25 16:15:01 UTC").toLocaleString()

，但这不起作用，而且我在 JS 方面不够专业（或者足够无聊）来尝试找出原因。

Answer 4

ExtJS

库，它具有有关日期和时间的功能，可以为您提供很多帮助。事实上，在我的 Mozilla Firefox 上，它根据浏览器时区显示所有日期和时间。