如何僅在場焦點上顯示日期選擇器？

-1

我正在添加jquery mobile date picker，但它默認顯示日期選擇器。相反，我希望它只顯示在焦點上，並在該領域失去焦點時被隱藏......任何想法如何？如何僅在場焦點上顯示日期選擇器？

頁標題我在補充人體

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
<link rel="stylesheet" href="/css/jquery.ui.datepicker.mobile.css" /> 
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script> 
    //reset type=date inputs to text 
    $(document).bind("mobileinit", function(){ 
    $.mobile.page.prototype.options.degradeInputs.date = true; 
    }); 
</script> 
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
<script src="/js/jQuery.ui.datepicker.js"></script> 
<script src="/js/jquery.ui.datepicker.mobile.js"></script>

和日期字段，使其工作：

<label for="date">Date Input:</label> 
<input type="date" name="date" id="date" value="" />

來源

2013-01-21 Steve

向我們展示一些代碼 – jbabey

遺憾的是目前它不能這樣做，除非你願意實施它自己。 jQuery Mobile datepicker從來沒有打算作爲widget正式發佈（也許有一天，但從未正式宣佈）。可用的代碼不過是jQuery UI日期選擇器的封裝。

你可以自己去查，這裏是一個一小段代碼片段，顯示上pagecreate事件一個datepicker：

$(".ui-page").live("pagecreate", function(){  
    $("input[type='date'], input:jqmData(type='date')").each(function(){ 
     $(this).after($("<div />").datepicker({ altField: "#" + $(this).attr("id"), showOtherMonths: true })); 
    }); 
});

您可以自行更改，但什麼點。如果你沒有時間，自定義實現一起來看看這些第三方jQuery Mobile的日期選擇器：

第一個是摩比採擷：http://mobipick.sustainablepace.net/demo.html。簡單，輕鬆和強大。只是你需要的一個。我的最愛。
可能最好的一個是：http://mobiscroll.com/。它曾經是我最喜歡的（仍然是如果我需要良好的用戶界面）。主要是因爲它具有良好的用戶界面強大。
另外一個很好的是Datebox：http://dev.jtsage.com/jQM-DateBox2/。也強大，但小車。

也看看我的其他類似的文章：https://stackoverflow.com/a/13779992/1848600

來源

2013-01-21 17:45:14 Gajotres

如何僅在場焦點上顯示日期選擇器？

回答

相關問題