处理浏览器对 HTML 输入 type="date" 的特定支持

Posted 2023-05-07

【中文标题】处理浏览器对 HTML 输入 type="date" 的特定支持

【英文标题】：Handling browser-specific support of HTML input type="date"

【发布时间】：2014-03-11 09:40:09

【问题描述】：

我知道 html 5 input 标记与 type="date" 一起使用时，需要按照 here 的描述提供 RFC 3339 完整日期。这里有很多问题，比如this one，提到这个。

但是，浏览器对日期类型输入标签的支持差异很大。例如，ios 7 上的 Safari 使用了一个不错的日期选择器，您可以在其上上下翻转以分别选择日、月和年。另一方面，Internet Explorer 10 不以任何特殊方式处理日期类型输入标签，将它们视为纯文本输入标签。

当我们将这两个事实放在一起时，我们会发现以下内容。如果我在我的页面上为日期类型输入标记提供格式正确的 RFC 3339 完整日期，如预期的那样，它会在对其具有特殊支持的浏览器中很好地显示它，例如 iOS 7 上的 Safari。但是，输入标记显示一个在不以任何特殊方式处理它的浏览器（例如 Internet Explorer 10）上的丑陋且用户不友好的 yyyy-mm-dd 日期。我无法向我的用户显示 yyyy-mm-dd 日期，所以我想我宁愿为我的输入标签提供用户友好的格式化日期，例如 dd/MMM/yyyy（这是我们在这里使用的格式）。但是，这在将其作为简单文本处理的浏览器（如 Internet Explorer）上运行良好；在 iOS 7 上的 Safari 上，它需要一个正确的 RFC 3339 完整日期，日期类型输入标记显示为空白。

所以我被困住了。我想我需要一种方法来单独手动处理浏览支持，并根据客户端使用的浏览器以编程方式格式化我的日期。我的问题是：

我真的需要这样做吗，或者有解决方法吗？ 如果我需要这样做，您能否建议一个简单的方法？我正在使用 ASP.NET、C# 和 Bootstrap 3。

我宁愿避免仅仅为了解决这个问题而引入诸如modernizr之类的额外框架。如果这太难或太麻烦而无法修复，我总是可以重新使用纯文本标签。

谢谢。

【参考方案1】：

见this。它推荐 2 个 polyfill。 This one 和 this one。两个看起来都不错。做浏览器检测然后特殊格式比较乱，不推荐。

【讨论】：

谢谢。我已经阅读了文档，似乎我需要在我的网络应用程序中包含其他框架，这是我宁愿避免的。我将首先探索其他选项。还是谢谢。