0

我有一个输入字段，我想在上面使用日期选择器。我正在使用 jquery 日期选择器，然后我意识到它在 iphone 上效果不佳，我阅读将其更改为使用 ios 的本机日期选择器的 html5 input type="date"。但是，这也适用于其他浏览器吗？最好的方法是什么，因为我不希望 jquery ui 日期选择器和 ios 的自然日期选择器都出现在 iphone 上。

4

2 回答 2

1

对 datepicker 输入类型的支持非常罕见。见这里。在支持该功能的少数浏览器中，支持和实现非常不同。

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

我不确定 jQuery Ui Datepicker 是否足够聪明，可以检测输入类型是否受支持，如果不出现。但为了节省开支，我会使用 jQuery Ui 之一。

有很多可能性。究竟是什么不那么好？

编辑

随着这个答案被接受，我只想弄清楚问题是什么（安德鲁韦尔奇在下面的评论中提到了它）。如果用户可以选择在日期选择器的输入字段中输入内容，则 iPhone 键盘会触发，这会导致不希望的行为并“破坏”日期选择器。为了防止这种情况，您只需将输入设置为只读字段。

<input type="text" id="datepicker" readonly="readonly">
于 2013-04-28T08:50:59.653 回答
1

我有同样的问题，我认为你可以使用 jQuery Mobile ui 日期选择器。iOS(Safari)支持原生日期选择器，而android不支持！ 在此处输入图像描述 您需要检测客户端是否为 iOS 客户端，然后使用input type="date" else 使用jQuery Mobile的UiDatePicker

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

<?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"

代码（jQuery 移动）：

<input type="date" name="date" id="date" value=""  data-role="datebox"
   data-options='{"mode": "datebox","useDialogForceFalse": true}' readonly="readonly" />
于 2013-04-28T09:53:41.447 回答