2013-03-14 67 views
4

我正在为android创建一个HTML5应用程序。为Android创建类型为date的Textfield

我使用jQuery移动与以下标题:

<link rel="stylesheet" href="../../lib/jquery.mobile-1.3.0.min.css" /> 
<script src="../../lib/jquery-1.8.2.min.js"></script>  
<script src="../../lib/jquery.mobile-1.3.0.min.js"></script> 

,我添加的输入字段在jQuery mobile's demo site描述:

<input type="date" data-clear-btn="false" name="date-1" id="date-1" value=""> 

然而,而非日期选择器我只是得到一个文本框。

我错过了什么吗?

回答

3

只有某些浏览器才会显示日期选择器。这篇文章可能是有益的你如果会或无法检测:

HTML5 Type Detection and Plugin Initialization

如果浏览器不支持的日期选择器,那么你可以添加自定义的jQuery UI的日期选择器

+0

你说得对,日期选择器是用chrome显示 – Daniel 2013-03-14 12:17:06

0

当然这是你需要初始化日期选择器文本字段:

,你需要一个jQuery用户界面库:

<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script> 


$(document).on('pageinit', function(){ 
    $("#date-1").datepicker(); 
}); 

尝试了这一点,看看是否有帮助。

5

首先仅限Chrome会显示datapicker组件。其他桌面浏览器将失败,因此不要依赖此实现。其次,jQuery Mobile没有datepicker组件。所以你需要使用第三方插件。不要依赖jQuery UI datepicker插件,因为它们没有针对移动应用进行优化。

更好地利用一些有第三方jQuery Mobile的插件:

Datebox

Mobiscroll

这里有一些我的答案和实例如何使用JQM datapickers:

How to show datepicker on field focus only?

Datepicker for jQuery mobile (Android)