Значение datetime-local
Синтаксис
HTML
<input type="datetime-local">
Описание
Тип datetime-local создаёт поле ввода локальной даты и времени.
Внешний вид
‒ поле ввода локальной даты и времени (Chrome);
‒ наведение курсора;
‒ фокус;
‒ интерфейс выбора даты и времени.
Поддержка браузерами
Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.
IExplorer
Поддерж.
Safari
Поддерж.
iOS
Поддерж.
Android
Поддерж.
Спецификация
| Верс. | Раздел |
|---|---|
| HTML | |
| 2.0 | |
| 3.2 | |
| 4.01 | |
| 5.0 | |
| 5.1 | 4.10.5.1.12. Local Date and Time state (type=datetime-local) |
| XHTML | |
| 1.0 | |
| 1.1 | |
Сопутствующие атрибуты
- autocomplete
- Автозаполнение значения поля ввода даты и времени.
- autofocus
- Автоматческая фокусировка на поле ввода даты и времени после полной загрузки страницы.
- disabled
- Блокировка поля ввода локальной даты и времени.
disabled="disabled" - form
- Присоединение поля ввода даты и времени к форме.
- list
- Создание списка рекомендованных вариантов вводимой даты и времени.
- max
- Указывает, верхний (максимальный) предел ввода даты и времени.
- min
- Указывает, нижний (минимальный) предел ввода даты и времени.
- name
- Присвоение имени полю ввода даты и времени.
- readonly
- Указывает, что поле ввода даты и времени доступно только для чтения (изменение/редактирование запрещено).
- required
- Указывает, что поле ввода даты и времени обязательно для заполнения.
- step
- Устанавливает интервал увеличения числового значения даты и времени.
- value
- Указывает значение, которое должно быть допустимой строкой даты и времени (отправляется на сервер или используется скриптами). Значение должно иметь следующий формат: «
<дата><разделитель><время>».
value="2015-10-09T21:44:27.123" - Глобальные атрибуты
- accesskey, class, contenteditable, data-*, dir, draggable, dropzone, id, inert, lang, spellcheck, style, tabindex, title, translate, xml:lang
Пример использования
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Значение datetime-local (input-type)</title>
</head>
<body>
<h1>Пример с полем ввода локальной даты и времени "type=datetime-local"</h1>
<fieldset> <legend><b>Введите дату и время события</b></legend>
<p><input type="datetime-local" list="dateList"></p>
<datalist id="dateList">
<option value="2017-01-01T00:00:00" label="Новый 2017 год">
<option value="2018-01-01T00:00:00" label="Новый 2018 год">
<option value="2019-01-01T00:00:00" label="Новый 2019 год">
</datalist>
</fieldset>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Значение datetime-local (input-type)</title>
</head>
<body>
<h1>Пример с полем ввода локальной даты и времени "type=datetime-local"</h1>
<fieldset> <legend><b>Введите дату и время события</b></legend>
<p><input type="datetime-local" list="dateList"></p>
<datalist id="dateList">
<option value="2017-01-01T00:00:00" label="Новый 2017 год">
<option value="2018-01-01T00:00:00" label="Новый 2018 год">
<option value="2019-01-01T00:00:00" label="Новый 2019 год">
</datalist>
</fieldset>
</body>
</html>
Значение datetime-local (input-type)