如何從 HTML5 日期輸入中解析日期？

Question

我的網頁上有一個輸入，我可以通過獲取 ISO 字符串並提取前 10 個字符來設置日期。

date = new Date();
dateInput.value = date.toISOString().substr(0,10);

這完美地工作。 我的問題是，當我嘗試恢復日期時。 我要請一天假。

var newDate = new Date(dateInput.value);

我也嘗試了以下代碼來彌補它，但它也不總是正確的

新日期(Date.parse(element.value) + 86400000)

所以我的問題是：是否有一種優雅的方法可以始終如一地獲得正確的日期。 我已經環顧了一段時間，但似乎與 Javascript 中的日期解析沒有太大的一致性。

Answer 1

如果它是支持瀏覽器上的實際date輸入，那么它將具有valueAsDate屬性。 沒有必要解析它。

Answer 2

它將日期解釋為 UTC，對於大多數時區，這將使它看起來像“昨天”。 一種解決方案可能是將時區偏移量添加回日期以將其“轉換”為您的本地時區。

Answer 3

var newDate = new Date(dateInput.value + 'T00:00');

這將在任何時區給出正確的日期。

Answer 4

您還可以將輸入字符串從YYYY-MM-DD為MM/DD/YYYY ，然后解析日期以獲得正確答案。

例子：

不要使用：

new Date(Date.parse('2018-09-28')) // Thu Sep 27 2018 19:00:00 GMT-0500 (Central Daylight Time)

而是使用

new Date(Date.parse('09/28/2018')) // Fri Sep 28 2018 00:00:00 GMT-0500 (Central Daylight Time)

（注意：我在 CDT）

在 Chrome、Firefox、Safari、舊版 Edge 和 IE 中測試。

Answer 5

正如馬蒂所說，問題是輸入時區（W3C 定義的 UTC）和 JS 時區（本地）的表示形式之間的差異。 解決方案是 getTimezoneOffset （以分鍾為單位）並將所有內容轉換為毫秒：

var today = document.getElementById("myInputDate").valueAsDate;
var tomorrow = new Date(today.valueOf() + 86400000 + (today.getTimezoneOffset() * 60000));

86400000 = 一天的毫秒數

today.getTimezoneOffset() * 60000 = timezoneOffset以毫秒為單位

Answer 6

嘗試使用.toLocaleString將日期輸入到輸入中，並在解析時添加時間，如下所示：

date = new Date();
dateInput.value = date.toLocaleString("sv-SE", {
    hour: "2-digit",
    minute: "2-digit",
    second: "2-digit"
});

要將值放入 Date 對象，請使用：

new Date(inputdateInput.value + "T00:00");

我寫了一個小職位約Date對象和日期輸入之間轉換這里