< input > элементы типа month создают поля ввода, которые позволяют пользователю вводить месяц и год. Значение представляет собой строку, значение которой имеет формат " YYYY-MM", где YYYY— четырехзначный год, а MM— номер месяца.

Пользовательский интерфейс элемента управления в целом варьируется от браузера к браузеру; на данный момент поддержка неоднородна, и только Chrome/Opera и Edge на настольных компьютерах — и большинство современных версий мобильных браузеров — имеют пригодные для использования реализации. В браузерах, не поддерживающих month ввод, элемент управления изящно деградирует до простого < input type="text" > , хотя может выполняться автоматическая проверка введенного текста, чтобы убедиться, что он отформатирован должным образом.

Вы можете установить значение по умолчанию для элемента управления вводом, включив в value атрибут месяц и год, например:

Следует отметить, что отображаемый формат даты отличается от фактического value ; большинство пользовательских агентов отображают месяц и год в соответствующей локали форме, основанной на установленной локали операционной системы пользователя, тогда как дата value всегда имеет формат yyyy-MM.

Например, когда указанное выше значение отправляется на сервер, оно будет выглядеть так bday-month=1978-06.

Вы также можете получить и установить значение даты в JavaScript, используя HTMLInputElement.value свойство, например:

Самое простое использование < input type="month" > включает в себя комбинацию базового элемента < input > и < label > элемента, как показано ниже:

Вы можете использовать атрибуты min и max для ограничения диапазона дат, который может выбрать пользователь. В следующем примере мы указываем минимальный месяц 1900-01 и максимальный месяц 2013-12:

Можно выбрать только месяцы с января 1900 г. по декабрь 2013 г.; месяцы за пределами этого диапазона не могут быть прокручены в элементе управления.

< input type="month" > не поддерживает атрибуты размера формы, такие как size . Вам придется прибегнуть к CSS для определения размеров.

По умолчанию < input type="month" > никакая проверка не применяется к введенным значениям. Реализации пользовательского интерфейса обычно не позволяют вам вводить что-либо, кроме даты, что полезно, но вы все равно можете отправить форму с month пустым полем ввода или ввести недопустимую дату (например, 32 апреля).

Чтобы избежать этого, вы можете использовать minи maxдля ограничения доступных дат (см. Установка максимальных и минимальных дат ), а также использовать required атрибут, чтобы сделать заполнение даты обязательным. В результате поддерживающие браузеры будут отображать ошибку, если вы попытаетесь отправить дату, выходящую за установленные границы, или пустое поле даты.

Давайте посмотрим на пример; здесь мы установили минимальную и максимальную даты, а также сделали поле обязательным: