4

我有一个页面，其中包含一些输入 type="text" 并附加了 jQuery UI 日期选择器，该页面以“2012 年 2 月 14 日”格式输入日期到字段中。伟大的。现在我需要为移动/小屏幕调整界面。我遇到的问题是，当 iPhone 用户点击文本输入时，会出现 jQuery 日期选择器，并且 iOS 还显示它是本机文本输入键盘。

我尝试使用 Modernizr 来检测 html5 inputtype=date 可用性并禁用 jQuery 日期选择器（如果可用）并将输入类型切换为“日期”，以便了解这一点的设备可以使用其本机输入。但是，这会以后端系统不理解的格式“2012-02-14”输入日期。根据格式为“2012 年 2 月 14 日”的日期，已经完成了大量工作。

因此，如果有人可以提供帮助，我正在寻找一种仅让 jQuery UI 日期选择器出现在所有系统上的方法，或者寻找一种意味着可以强制本地日期/文本输入输入格式“2012 年 2 月 14 日”的解决方案。

4

1 回答 1

1

不幸的是，日期选择器格式不能被覆盖，因为它与用户的系统设置相关联。

实际上，您可以做的是让您的脚本根据可用技术（例如 Modernizr.inputtypes.date）进行从 type="text" 到 type="date" 的动态切换。

从那里您可以嵌入一个隐藏字段并将当前日期字段的名称转换为该隐藏字段，然后将本地日期选择器中的日期格式解析为您想要的格式并设置该隐藏字段的值。

<input type="date" name="userSetDate"/>

对此：

<input type="date"/>
<input type="hidden" name="userSetDate" value="mm/dd/yyyy"/>

由于格式的变化，困难在于将用户定义的格式解析为您想要的格式：

10-06-13 --> 是 2013 年 10 月 6 日还是 2013 年 6 月 10 日？

现在，您可以通过将标签设置为看起来像按钮的样式、应用准确的 [for] 属性并将 datepicker 字段设置为 type="hidden" 并将 datepicker 应用到该选项来执行与顶级解决方案相结合的操作。

<label for="fooDate">test</label>
<input type="hidden" name="fooDate" id="fooDate">

<script>
$('#fooDate').datepicker();
</script>

希望您（是，注意到发布日期）能够弄清楚！

于 2013-06-17T18:51:10.377 回答