如何在HTML5手機中打開日曆字段的日曆？

我正在創建一個使用HTML5和jQuery移動版的移動應用程序。我有包含類型「日期」的字段的一種形式：如何在HTML5手機中打開日曆字段的日曆？

<form id="registrationForm"> 
    <div data-role="fieldcontain"> 
     <input type="date" name="dateOfBirth"/> 
    </div> 
    <img id="calendar_logo"/> 
</form>

當用戶點擊領域中，瀏覽器的本地壓延節目。我需要的是，該日曆在calender_logo圖像上單擊時顯示。

我試圖用jQuery設置的focusIn，但它一點兒也不工作：

$('#calendar_logo').click(function(){ 
     $("#registrationForm input[name='dateOfBirth']").focusin(); 
});

任何人可以請幫助？

謝謝！

來源

2014-01-06 yogev

檢查此鏈接http://demos.jquerymobile.com/1.4.0/datepicker/ – mcmac

謝謝，但我不想使用jQuery的插件。我希望顯示本地瀏覽器的日期選擇器。 – yogev

對不起，但我不明白，你使用jquery mobile，你發佈jquery函數，所以如果你想創建跨瀏覽器日曆，你將需要jQuery或其他框架。也許這個鏈接將有所幫助http://stackoverflow.com/questions/15530850/method-to-show-native-datepicker-in-chrome – mcmac

您的日曆徽標可以包裹在指向該字段的標籤標籤中。你只需要給該字段一個ID。

<form id="registrationForm"> 
    <div data-role="fieldcontain"> 
     <input type="date" id="dateOfBirth" name="dateOfBirth"/> 
    </div> 
    <label for="dateOfBirth"> 
     <img id="calendar_logo"/> 
    </label> 
</form>

如果用戶點擊標籤，大多數瀏覽器將關注該字段。

來源

2014-02-20 05:55:28 ThiagoPXP

這不會在Chrome中打開日曆。 –

如何在HTML5手機中打開日曆字段的日曆？

回答

相關問題