HTML 5 日期选择器答案

【问题标题】：HTML 5 datepickerHTML 5 日期选择器
【发布时间】：2016-02-23 22:37:32
【问题描述】：

我使用 HTML5 和 jquery datepicker。

脚本：

$( "#myDate" ).datepicker({
        dateFormat: 'dd/mm/yy'
});

html:

<input type="date" name="myDate" id="myDate" value="">

当我在浏览器上尝试该示例时，它会显示 jquery datepicker。相反，当我在 android 设备上尝试该示例时，它向我显示了本机 android datepicker，并在选择日期后向我显示 jquery datepicker。

当我在安卓设备上时，怎么可能只显示安卓日期选择器？有任何想法吗？谢谢

【问题讨论】：

标签： jquery html jquery-ui datepicker

【解决方案1】：

一个简单的方法是拥有两个日期选择器，一个用于移动设备，一个用于桌面设备。然后使用媒体查询显示移动设备并在小屏幕上查看时隐藏桌面。

这样

HTML

<input type="date" name="myDate" id="myDate" value="">
<input type="date" name="myDate" id="mobile" value="">

css

#mobile{display: none}

@media (max-width: 600px){
#mobile{display: inline}
#myDate{display: none}
}

【讨论】：

【解决方案2】：

你可以使用这个方法：

var isAndroid = /android/i.test(navigator.userAgent.toLowerCase());

if (isAndroid)
{
  alert("mobile device");
}
else
{
  alert("not a mobile device");
}

【讨论】：