Я использую HTML5 <input type="date" />, который отлично работает в Chrome, и я получаю всплывающее окно календаря, чтобы выбрать дату.
Но в firefox он действует как текстовое поле, и календарь не открывается.
После нескольких исследований я вижу несколько решений с использованием webshims, modenizr и т.д., но я не хочу использовать jQuery.
Есть ли альтернатива для этого? Как я могу заставить его работать в Firefox?
EDIT: из Firefox 57, <input type="date"/> поддерживается .
Firefox пока не поддерживает HTML5 <input type="date"/>.
У вас есть два варианта:
Это называется Обнаружение функций и Modernizr - самая популярная библиотека для этого.
Использование всегда javascript datepicker проще и быстрее, но он не будет работать с отключенным javascript (кто заботится), он будет очень плохо работать на мобильном телефоне (это важно), и он будет пахнуть старым.
Использование гибридного подхода вместо этого позволит вам охватить все случаи сейчас, вплоть до того дня, когда каждый браузер будет поддерживать дату-пиккер HTML5, стандартизированным образом и без необходимости использования javascript вообще. Это надежное будущее, и это особенно важно при просмотре мобильных телефонов, где jappictary datepickers практически непригодны для использования.
Это пример запуска для каждого элемента <input type="date"/> каждой страницы автоматически:
<script>
$(function(){
if (!Modernizr.inputtypes.date) {
// If not native HTML5 support, fallback to jQuery datePicker
$('input[type=date]').datepicker({
// Consistent format with the HTML5 picker
dateFormat : 'yy-mm-dd'
},
// Localization
$.datepicker.regional['it']
);
}
});
</script>
Он использует jQuery, потому что я использую jQuery, но вы можете подставить части jQuery с помощью javascript ванили, а часть datepicker с помощью japcript-datepicker по вашему выбору.
Теперь он работает. Начиная с Firefox 53, вы можете активировать его в about:config, включив опцию dom.forms.datetype. См. http://caniuse.com/#feat=input-datetime и https://developer.mozilla.org/en-US/Firefox/Experimental_features
`input type="date"` is not supported on mozilla
проверьте ссылку для списка поддерживаемых событий
Я использую 6 выбранных HTML-элементов для разных элементов с инструкциями OPTION для правильных значений:
год 2000-2050 (или любой диапазон, который вы выберете) месяц 1-12 (вы можете указать, чтобы он показывал имена месяцев) день 1-31 час 0-23 (или использовать 12 полночь - 11 вечера, это просто изменяет отображение) минута 0-59 второй 0-59 (или просто предположим, что 0)
Нет необходимости в Javascript, хотя я использую некоторые, чтобы избежать недействительных выборов (например, 30 февраля). Это срабатывает при изменении месяца или года.
Какую версию firefox вы используете. Более низкие версии Firefox менее 30 не поддерживают большинство функций html5, а тип ввода html5 = "дата" не поддерживается в firefox. Для получения дополнительной информации см. http://caniuse.com/#feat=input-datetime.