Question

我知道在撰写本文时，只有Opera支持

的浏览器UI

<input type="date" name="mydate">

也许我尝试本地化这个领域已经遭遇挫折，因为本地化等细节尚未包含在他们的实现中，但我甚至没有在HTML5规范中看到它。有没有办法指定本地化？我应该在父元素上做lang =“fr”吗？

有关网站实施的一些注意事项：

用户明确选择本地化（语言），因为他们正在管理多种语言的数据，并且期望用户的浏览器chrome处于正在查看的语言或浏览器提供所需的语言请求标头是不合理的。
我想确保如果页面以法语呈现，浏览器chrome提供的日期选择器会显示对法语有意义的选项。
计划是针对不支持type =“date”的浏览器回退到jQueryUI，我将使用Dive into HTML 5中提供的检测机制

Answer 1

据我所知，我们在Opera中做的事情背后的想法（完全披露：我为他们工作）是日期选择器几乎是Chrome的扩展，一个浏览器本地控件。因此，它将根据浏览器的语言进行本地化，而不是正在查看的页面的语言。

Answer 2

我同意lambacck。目前我正在编写Javascript代码，使用新的表单功能跨浏览器，使用jQuery UI。

我在卢森堡工作，这是一个更详细地说明本地化问题的好地方。

我们撰写的大多数网站都是多语种de | fr | en。从我们的统计数据可以看出，人们使用网站上的语言切换来显示他们的首选语言，但这种选择很少与首选的浏览器语言环境相匹配。

如果操作系统完成了日历等字段的区域设置，则会将我们带回到不幸的＆lt; input type = file＆gt; 情况，其中标签显示上传文件，按钮显示 Parcourir 。你对这种语言组合无能为力，我总觉得这是一个很大的烦恼。

结论，我必须使用jQuery覆盖默认日历，以确保它能够满足我的需求。

在我看来，可配置的API或至少一种在HTML级别上操作区域设置的方法会很棒。由于新的字段类型尚未被其他浏览器制造商广泛采用，我想这个问题仍然可以考虑在内。

感谢您阅读本文。

Answer 3

对于移动设备，我们找到的最佳解决方案是使用文本输入进行日期输入，旁边有一个日历图标，图标上有一个不可见的日期输入。

优点：

适用于所有浏览器和设备
可以在iOS上使用下一个按钮进入日期（如果是多个字段）
用户可以输入日期（非常有用）
避免iOS UI错误（1.编辑现有数据，空白日期，下一个日期，日期值设置为今天 - arrrgh，2。键盘显示，下一个日期，弹出显示和键盘消失 - ouch）
使用日期库将输入中的日期显示为用户帐户（而非浏览器）的本地化集，并且可以使用智能日期库（输入“明天”等）。
点击日历图标以查看日期作为浏览器本地化
优雅后备即使设备/浏览器不支持input type=date（例如某些Android设备不支持日期或存在严重错误）。
对于桌面（通过无触摸支持检测到），我们会显示自己的自定义日期下拉列表。

HTML类似于：

<input type=text>
<span style=position:relative>
  <input type=date class=date-input tabIndex=-1>
  <div class=date-input-icon>&#x25BC;</div>
</span>

CSS：

.date-input {
  position: relative;
  z-index: 1;
  webkit-appearance: none;
  display: inline-block;
  opacity: 0;
  width: 1em;
}

.date-input-icon {
  position: absolute;
  right: 0;
  width: 1em;
}

有没有办法在HTML5中本地化输入类型=“日期”

3 个答案: