2013-03-14 66 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)