HTML输入jQuery UI datepicker vs iOS原生日期输入

我有一个页面,其中有一些输入类型=“text”,附带了一个jQuery UI datepicker,它以“2012年2月14日”格式输入日期到该字段.大.现在我需要调整移动/小屏幕界面.我遇到的问题是,当iPhone用户点击文本输入时,会出现jQuery日期选择器,iOS也会显示它的本机文本输入键盘.

我尝试使用Modernizr来检测html5 inputtype = date availability并禁用jQuery datepicker(如果它可用)并将输入类型切换为“date”,这样理解这一点的设备可以使用它们的本机输入.但是,这将以后端系统无法理解的格式“2012-02-14”输入日期.根据以“2012年2月14日”格式到达的日期,已经做了很多工作.

因此,如果有人可以提供帮助,我正在寻找一种方法,只能让jQuery UI datepicker出现在所有系统上,或者寻找一种解决方案,这意味着可以强制原生日期/文本输入进入“2012年2月14日”格式.

解决方法

不幸的是,由于它与用户的系统设置相关联,因此无法覆盖日期选择器格式.

事实上你可以做的是让你的脚本根据可用的技术(例如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>

希望你(能够,注意到这个发布的日期)能够弄清楚！