Как открыть календарь для поля даты в HTML5 mobile?

Я создаю мобильное приложение, использующее HTML5 и jQuery mobile. У меня есть форма, содержащее поле типа «дата»:Как открыть календарь для поля даты в HTML5 mobile?

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

Когда пользователь вводит поле, браузер родной каландр показывает. Что мне нужно, это для того, чтобы этот календарь показывался по клику на изображении calender_logo.

Я попытался установить focusin с JQuery, но does'nt работы:

$('#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 mobile?

ответ

Смежные вопросы