HTML5 输入日期类型未以一致的格式存储答案

【问题标题】：HTML5 input date type is not storing in a consistent formatHTML5 输入日期类型未以一致的格式存储
【发布时间】：2016-08-17 16:40:37
【问题描述】：

在使用类型设置为“日期”的 HTML5 输入字段时遇到问题。

我的测试页面如下：

<!DOCTYPE html>
<html>

<head>
    <script>
    function testDate() {  
       window.alert("Date: " + document.getElementById("date").valueAsDate.toJSON());
    }
    </script>
</head>

<body>
    <form>
      <label for="date">Date</label>
      <input id="date" type="date" onchange="testDate()" required />
    </form>
</body>

</html>

如果我在 Opera 中加载此页面，我会看到一个“日期选择器”。如果我选择 2016 年 8 月 10 日，我会看到一个显示正确行为的弹出窗口，即显示以下内容：

"Date: 2016-06-10T00:00:00.000Z"

如果我在 Firefox 中加载页面，我不会得到任何类型的“日期选择器”，它会让我输入任何我想要的值。我尝试了以下输入：

2016 年 10 月 8 日
10-08-2016
2016-08-10

在所有情况下，我都会在控制台中记录以下内容：

TypeError: document.getElementById(...).valueAsDate is undefined

在我的真实代码中，我只是想让用户选择一个日期，将其转换为 JSON 日期，然后通过 XMLHttpRequest 发送，但我似乎找不到日期格式的任何一致性。

有人可以帮忙吗？

【问题讨论】：

date 输入类型在 Firefox 中不受支持。 w3schools.com/html/html_form_input_types.asp找Input Type: date

标签： javascript html firefox opera

【解决方案1】：

目前，如果您不创建特定于浏览器的 Web 应用程序，则使用字段还为时过早。如您所见here - Firefox、Safari 和 Internet Explorer 不支持这种输入字段。

您可以尝试使用pattern attribute，它可用于简单验证用户输入。它有更好的支持，但仍然不完美。

您也可以尝试使用one of these vanillaJS datepicker implementations。

【讨论】：

谢谢。我现在将暂停使用日期类型。同时，您能否提出将包含格式 DD/MM/YYYY 的文本输入字段转换为 Javascript 日期类型的最佳方法？
您必须使用“/”作为分隔符来拆分值，然后以正确的顺序将参数应用到 Date 对象构造函数中。
谢谢。我做了这样的事情：var date = new Date(dateString.split('/')[2], dateString.split('/')[1] - 1, dateString.split('/')[0]);