Question

我有一个输入fieild我想使用日期选择器。我正在使用jquery日期选择器，然后我意识到它在iphone上运行不正常，我读到将其更改为使用ios的本机日期选择器的html5输入类型=“日期”。但是这对其他浏览器也有效吗？什么是最好的方法，因为我不希望jquery ui日期选择器和ios的自然日期选择器出现在iPhone上。

Answer 1

对datepicker输入类型的支持非常少见。见here。支持该功能的少数浏览器的支持和实现非常不同。

Safari提供日期格式的文本字段，但没有真正的日历窗口小部件。 Chrome中的部分支持是指“日期”类型的日历窗口小部件，但只是所有其他日期/类型字段的文本字段。 Chrome 23支持“时间”类型。 Chrome 25增加了对“周”和“月”类型的支持。 Android 4.x浏览器的某些修改版本确实支持日期/时间字段。

我不确定jQuery Ui Datepicker是否足够聪明，可以检测是否支持输入类型，如果没有，则不会出现。但是为了保存，我会使用jQuery Ui。

有很多可能性。究竟什么不能很好地运作？

修改

当这个答案被接受时，我只想弄清问题是什么（Andrew Welch在下面的评论中提到了这个问题）。如果用户可以选择在日期选择器的输入字段中键入内容，则iPhone键盘将触发，从而导致不必要的行为并“中断”日期选择器。为了防止这种情况，您只需将输入作为只读字段。

<input type="text" id="datepicker" readonly="readonly">

Answer 2

我有同样的问题，我认为你可以使用jQuery Mobile ui日期选择器。 iOS（Safari）支持原生日期选择器和 android不是！ enter image description here 您需要检测客户端是否是iOS客户端，然后使用input type="date" else来使用jQuery Mobile的UiDatePicker

您可以通过此代码检测设备是否为iOS（PHP according to Haim Evgi）：

<?php

//Detect special conditions devices
$iPod    = stripos($_SERVER['HTTP_USER_AGENT'],"iPod");
$iPhone  = stripos($_SERVER['HTTP_USER_AGENT'],"iPhone");
$iPad    = stripos($_SERVER['HTTP_USER_AGENT'],"iPad");
$Android = stripos($_SERVER['HTTP_USER_AGENT'],"Android");
$webOS   = stripos($_SERVER['HTTP_USER_AGENT'],"webOS");

//do something with this information
if( $iPod || $iPhone ){
    //browser reported as an iPhone/iPod touch -- do something here
}else if($iPad){
    //browser reported as an iPad -- do something here
}else if($Android){
    //browser reported as an Android device -- do something here
}else if($webOS){
    //browser reported as a webOS device -- do something here
}

?>

最后，您需要将<input>标记设置为readonly="readonly"

CODE（ jQuery Mobile ）：

<input type="date" name="date" id="date" value=""  data-role="datebox"
   data-options='{"mode": "datebox","useDialogForceFalse": true}' readonly="readonly" />

html 5输入日期类型是否足以在所有浏览器中选择日期

2 个答案: