javascript - 设置日期时间显示错误的日期

Question

我有两个单选按钮来选择时间范围。

这两个选项可用:

0:00 - 0:00(24 小时)

6:00 - 6:00(24 小时)

这是我的 jQ 函数:

$('.btn-time').on('change', function() {
    var value = $(this).attr('data-value');
    var a = new Date($('#ipDateTimeFrom').val());
    var b = new Date($('#ipDateTimeTo').val());
    switch(value) {
        case '0':
            a.setUTCHours(0);
            a.setUTCMinutes(0);
            a.setUTCSeconds(0);
            b.setUTCHours(0);
            b.setUTCMinutes(0);
            b.setUTCSeconds(0);
            break;
        case '6':
            a.setUTCHours(6);
            a.setUTCMinutes(0);
            a.setUTCSeconds(0);
            b.setUTCHours(6);
            b.setUTCMinutes(0);
            b.setUTCSeconds(0);
            break;
    }

    $('#ipDateTimeFrom').val(a.toISOString().replace('T', ' ').replace( /\..+/g, ''));
    $('#ipDateTimeTo').val(b.toISOString().replace('T', ' ').replace( /\..+/g, ''));
});

如果我在 0:00 和 6:00 之间切换，日期将从 2016-06-07 00:00:00 更改为 2016-06-06 06:00:00，我不知道为什么。日期未受影响。

这是一个有效的 jsbin指出问题

Answer 1

发生这种情况是因为您将本地时间与 UTC 时间混合在一起，并且您可能生活在 UTC + 某个时区。

更准确地说，您从输入元素中读取并转换为日期的字符串值被解释为本地日期/时间。但在 UTC 格式中，这是几个小时前的时间，因此当您开始将日期 chop 为 0:00 时，一切仍然正常，但随后输入也变为 0:00，这在 UTC 中是几个小时前，即在前一天。因此，下次执行 chop 到 6:00 时，它将是前一天的 6:00。

因此，您应该坚持使用 UTC 或本地日期进行所有操作。以下是如何将输入字符串解释为 UTC，以便所有操作都采用 UTC:

var a = new Date($('#ipDateTimeFrom').val().replace(' ', 'T') + 'Z');
var b = new Date($('#ipDateTimeTo').val().replace(' ', 'T') + 'Z');
// etc.

当然，这是假设输入的日期/时间遵循特定格式。但是你会明白的。末尾的 Z 使其成为 UTC。