Javascript 从输入类型日期返回不正确的日期答案

【问题标题】：Javascript returning incorrect date from an input type dateJavascript 从输入类型日期返回不正确的日期
【发布时间】：2014-12-03 09:08:09
【问题描述】：

当我选择一个日期，比如 2014 年 12 月 3 日，它会在我输入的前一天返回 2014 年 12 月 2 日星期二 16:00:00 GMT-0800（太平洋标准时间）？

 <script>

function getAge() {
    var today = new Date();
    var birthDate = new Date(document.forms["name"]["birth"].value);
    var age = today.getFullYear() - birthDate.getFullYear();
    var m = today.getMonth() - birthDate.getMonth();

    if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate()+1)) {
        age--;
    }
    document.getElementById('age').innerHTML = birthDate;
}
</script>

<form name='name' onsubmit='return false'>
  <input type="date" name="birth">
<p id='age'></p>
<button onclick='getAge()'>check</button>

</form>

【问题讨论】：

这是时区问题。
我在南非，当我运行代码时，它给了我正确的选择日期。 jsbin.com/luvolaboba/1/edit

标签： javascript date

【解决方案1】：

这是一个老问题，但我想重新提出它，因为这是我的 Google 查询中的第一个结果，而接受的答案并不能很好地回答这个问题。所以我提供了更多信息供其他人偶然发现。

Date 对象中有几个方便的方法可能对那些试图解决这个 JavaScript 小怪癖的人有所帮助。

在我看来，没有办法以编程方式更改 Date 对象时区偏移量，必须使用字符串操作来完成，这确实是不可取的，但没有其他办法。 Date 对象构造函数在解释日期时总是使用本地机器时区，并且这不能更改。因此，您必须了解，当您创建一个基本上忽略时区的 Date 时，更改的Date 对象将代表与原始 Date 不同的时间点。 新的 Date 对象将自动采用本地计算机的时区，但它将使用您在单个构造函数参数或字符串参数中指定的 (year, month, date, hour, min, sec, ms) Date 类（以下两个选项中的）。

我找到了两种解决此问题的方法，并从 type="date" 输入字段中生成正确的日期。请使用您认为更有效或更适合您的解决方案的一种。就个人而言，我更喜欢使用 OPTION B，因为它比字符串操作更具程序性，并且可能更可靠。也比较简单。

选项 A：UTC 日期字符串操作

getUTCDate - 根据通用时间返回日期对象的月份日期（从 1 到 31）。 UTC 方法计算它们的日期假定日期对象是本地时间和日期。

getUTCString - 根据通用时间将 Date 对象转换为字符串。

注意：Date 构造函数恢复为本地时区。因此，您不能使用 getUTCString() 值构建新的 Date 并期望从输入字段中获取正确的日期。

您可以通过使用getUTCDate() 和调用dateObject.setDate(dateObject.getUTCDate()); 来解决此问题，这只会更正对象的日期部分，因此您还需要分别使用dateObject.setMonth(dateObject.getUTCMonth()); 和dateObject.setFullYear(dateObject.getUTCFullYear()); 更正月份和年份.或者您可以删除getUTCString() 值的"GMT" 部分之后的所有内容，这将为您提供一个没有时区指定的字符串。然后，您可以使用该字符串创建一个新的 Date 对象，该对象将默认为客户端的时区。

//convert to UTC to avoid "date minus one" issues where the supplied date is interpreted incorrectly as
//the previous date.
date = new Date(document.getElementById('date').value);
console.log("original date: " + date.toString());
console.log("UTC date string: " + date.toUTCString());
//produces local machine timezone, and therefore incorrect date value
date = new Date(date.toUTCString());
console.log("UTC date string Date constructor: " + date.toString());
utcDate = new Date(utcString.substr(0, utcString.indexOf("GMT")));
console.log("UTC date string Date constructor (without 'GMT*'): " + utcDate.toString());
console.log("UTC date number: " + date.getUTCDate());
date.setDate(date.getUTCDate());
date.setMonth(date.getUTCMonth());
date.setFullYear(date.getUTCFullYear());
console.log("UTC modified date: " + date.toString());

输出：

original date: Fri Jan 29 2021 23:16:11 GMT-0600 (Central Standard Time)
UTC date string: Sat, 30 Jan 2021 05:16:11 GMT
UTC date string Date constructor: Fri Jan 29 2021 23:16:11 GMT-0600 (Central Standard Time)
UTC date string Date constructor (without 'GMT*'): Sat Jan 30 2021 23:16:11 GMT-0600 (Central Standard Time)
UTC date number: 30
UTC modified date: Sat Jan 30 2021 23:16:11 GMT-0600 (Central Standard Time)

选项 B：向 Date 构造函数提供所有 UTC 参数 （另见：Create a Date with a set timezone without using a string representation）

示例：

date = new Date(document.getElementById('date').value);
console.log("original date: " + date.toString());
date = new Date(
    date.getUTCFullYear(),
    date.getUTCMonth(),
    date.getUTCDate(),
    date.getUTCHours(),
    date.getUTCMinutes(),
    date.getUTCSeconds(),
    date.getUTCMilliseconds());
console.log("Date with UTC parameters: " + date.toString());

输出：

original date: Fri Jan 29 2021 23:04:03 GMT-0800 (Pacific Standard Time)
Date with UTC parameters: Sat Jan 30 2021 07:04:03 GMT-0800 (Pacific Standard Time)

【讨论】：

【解决方案2】：

错误的日期是由于您的时区设置造成的。现在是格林威治标准时间 8。考虑使用 UTC：http://www.w3schools.com/jsref/jsref_toutcstring.asp

【讨论】：