Date html input type: — HTML: HyperText Markup Language

Leave a Comment / Html / By /

Дата и время | htmlbook.ru

Наряду с календарём, предназначенном для указания даты, месяца или недели, иногда возникает необходимость вводить ещё и время, например, для точной публикации сообщения. Для подобных ситуаций используется поле datetime и datetime-local, синтаксис у них следующий.

<input type="datetime" атрибуты>
<input type="datetime-local" атрибуты>

Как и в случае с календарём пока поддержка этого поля имеется только в браузерах Opera (рис. 1) и Chrome (рис. 2). Атрибуты те же, что и для календаря.

Рис. 1. Вид поля для выбора даты и времени в Opera

Рис. 2. Ввод даты и времени в Chrome

Opera предоставляет удобный виджет сочетающий календарь и ввод времени, Chrome же ограничивается только полем, в котором можно прокручивать секунды или вводить текст вручную. Данные на сервер по умолчанию пересылаются в виде ГГГГ-ММ-ДДTчч:ммZ (например: 2015-09-25T12:15Z), где вначале указывается год, месяц и день, затем после латинской буквы T идут часы с минутами.

В теории вместо Z указывается часовой пояс (например: +08:00 или -04:00), а также по желанию секунды с дробной частью, но на практике всё ограничивается только минутами и без часового пояса. Более того, при их наличии Chrome выводит сообщение «Недопустимые данные» и не отправляет введённый текст.

В примере 1 показано создание поля для ввода даты и времени.

Пример 1. Дата и время

HTML5IE 7IE 8IE 9Cr 13Op 11Sa 5Fx 6

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Дата и время</title>
 </head>
 <body>
  <form>
   <p>Время создания публикации</p>
   <p><input type="datetime" name="created"></p>
   <p><input type="submit"></p>
  </form>
 </body>
</html>

Разница между значениями datetime и datetime-local заключается в добавлении часового пояса для datetime. На деле же пересылаются те же самые данные, только без Z в конце (2015-09-25T12:15).

Для ввода только времени без даты применяется <input type=»time»>, это поле также работает только в Opera и Chrome.

В примере 2 показано создание поля для ввода времени в указанном диапазоне.

Пример 2. Ввод времени

HTML5IE 7IE 8IE 9Cr 13Op 11Sa 5Fx 6

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Время</title>
 </head>
 <body>
  <form>
   <p>В какое время запускать Cron?</p>
   <p><input type="time" name="cron" value="03:15" min="00:01" max="06:00"></p>
   <p><input type="submit"></p>
  </form>
 </body>
</html>

В данном примере значение изначально задано с помощью атрибута value, а минимальное и максимальное время установлено через min и max.

формыкалендарь

Форматы даты и времени, используемые в HTML — HTML: Язык разметки гипертекста

Некоторые элементы HTML используют значения даты и/или времени. Форматы строк, задающих эти значения, описаны в этой статье.

Элементы, использующие такие форматы, включают определенные формы элемента , которые позволяют пользователю выбрать или указать дату, время или и то, и другое, а также элементы и , чей дата-время 9Атрибут 0006 указывает дату или дату и время, когда произошла вставка или удаление содержимого.

Для значения типа , которые возвращают значение , содержащее строку, представляющую дату и/или время:

  • date
  • дата-время-местный
  • месяц
  • время
  • неделя

Прежде чем углубляться в тонкости написания и анализа строк даты и времени в HTML, вот несколько примеров, которые должны дать вам хорошее представление о том, как выглядят наиболее часто используемые форматы строк даты и времени.

Перед рассмотрением различных форматов строк, связанных с датой и временем, используемых элементами HTML, полезно понять несколько основных фактов о том, как они определяются. HTML использует вариант стандарта ISO 8601 для своих строк даты и времени. Стоит просмотреть описания форматов, которые вы используете, чтобы убедиться, что ваши строки на самом деле совместимы с HTML, поскольку спецификация HTML включает алгоритмы для синтаксического анализа этих строк, которые на самом деле более точны, чем ISO 8601, поэтому могут быть тонкие различия в том, как должны выглядеть строки даты и времени.

Набор символов

Даты и время в HTML всегда являются строками, использующими набор символов ASCII.

Номера годов

Чтобы упростить базовый формат, используемый для строк даты в HTML, спецификация требует, чтобы все годы были даны с использованием современного (или пролептического ) григорианского календаря. Хотя пользовательские интерфейсы могут разрешать ввод дат с использованием других календарей, базовое значение всегда использует григорианский календарь.

Хотя григорианский календарь не был создан до 1582 года (заменив аналогичный юлианский календарь), для целей HTML григорианский календарь продлен до 1 года н.э. Убедитесь, что все более старые даты учитывают это.

В HTML-датах год всегда должен состоять не менее чем из четырех цифр; годы до 1000 года дополняются начальными нулями (« 0 »), поэтому 72-й год записывается как 0072 . Годы до 1 года н. э. не поддерживаются, поэтому HTML не поддерживает годы 1 до н. э. (1 г. до н.э.) или ранее.

Год обычно длится 365 дней, за исключением високосных лет .

Високосные годы

Високосный год – это любой год, который делится на 400 или год делится на 4, но не на 100. Хотя обычно календарный год длится 365 дней, на самом деле планете Земля требуется приблизительно 365,2422 дня, чтобы совершить один оборот вокруг Солнца. Високосные годы помогают настроить календарь, чтобы он синхронизировался с фактическим положением планеты на ее орбите. Добавление дня к году каждые четыре года, по сути, дает среднюю продолжительность года в 365,25 дня, что близко к правильному.

Корректировки алгоритма (учет високосного года, когда год делится на 400, и пропуск високосного года, когда год делится на 100) помогают еще больше приблизить среднее значение к правильному количеству дней (365,2425 дней). . Ученые время от времени добавляют в календарь високосные секунды (серьезно), чтобы справиться с оставшимися тремя десятитысячными дня и компенсировать постепенное, естественное замедление вращения Земли.

В то время как месяц 02 , февраль, обычно имеет 28 дней, в високосные годы 29 дней.

Месяцы года

В году 12 месяцев, пронумерованных от 1 до 12. Они всегда представлены строкой ASCII из двух цифр, значение которой находится в диапазоне от 01 до 12 . См. таблицу в разделе «Дни месяца» для номеров месяцев и соответствующих им названий (и длины в днях).

Дни месяца

Номера месяцев 1, 3, 5, 7, 8, 10 и 12 имеют длину 31 день. Месяцы 4, 6, 9, а 11 - 30 дней. Месяц 2, февраль, в большинстве лет длится 28 дней, но в високосные годы он составляет 29 дней. Это подробно описано в следующей таблице.

Месяцы года и их продолжительность в днях
Номер месяца Имя (на английском языке) Продолжительность в днях
01 январь 31
02 9 февраля0115 28 (29 в високосные годы)
03 март 31
04 апрель
30
05 май 31
06 июнь 30
07 июль 31
08 август 31
09 сентября 30
10 октябрь 31
11 ноябрь 30
12 декабрь 31

Строка недели указывает неделю в определенном году. Строка допустимой недели состоит из действительного номера года, за которым следует символ дефиса ("

- " или U+002D), затем заглавная буква " W " (U+0057), за которой следует двузначная неделя недели. значение года.

Неделя в году представляет собой строку из двух цифр между 01 и 53 . Каждая неделя начинается в понедельник и заканчивается в воскресенье. Это означает, что первые несколько дней января можно считать частью предыдущего недельного года, а последние несколько дней декабря — частью следующего недельного года. Первая неделя года – это неделя, содержащая первый четверг года. Например, первый четверг 1953 года приходится на 1 января, поэтому эта неделя, начинающаяся в понедельник, 29 декабря, считается первой неделей года. Таким образом, 30 декабря 1952 года приходится на неделю 1953-W01 .

В году 53 недели, если:

  • Первый день календарного года (1 января) приходится на четверг или
  • Первый день года (1 января) — среда, а год — високосный

Все остальные годы состоят из 52 недель.

Обратите внимание, что и год, и номер недели дополняются ведущими нулями, год дополняется четырьмя цифрами, а неделя — двумя.

Строка месяца представляет конкретный месяц во времени, а не общий месяц года. То есть вместо «января» строка месяца HTML представляет месяц и год в паре, например «январь 1972 года».

Строка допустимого месяца состоит из действительного номера года (строка из не менее четырех цифр), за которым следует символ дефиса (" - ", или U+002D), за которым следует двузначный числовой номер месяца, где 01 представляет январь, а 12 представляет декабрь.

Обратите внимание, что все годы имеют длину не менее четырех символов; длина менее четырех цифр дополняется ведущими нулями

Действительная строка даты состоит из строки месяца, за которой следует символ дефиса ("

- ", или U+002D), за которым следует двузначный день месяца. месяц

Строка времени может указывать время с точностью до минуты, секунды или миллисекунды. Указание только часов или минут не допускается. A действительная строка времени как минимум состоит из двухзначного числа часов, за которым следует двоеточие (" : ", U+003A), а затем двузначное число минут. За минутой может дополнительно следовать еще одно двоеточие и двузначное количество секунд. Миллисекунды могут быть указаны, опционально, путем добавления символа десятичной точки (" . ", U+002E), за которым следует одна, две или три цифры.

Есть несколько дополнительных основных правил:

  • Час всегда указывается в 24-часовом формате, с 00 — полночь, а 23:00 — 23 . Никакие значения вне диапазона 00 – 23 не допускаются.
  • Минуты должны быть двузначными числами от 00 до 59 . Никакие значения за пределами этого диапазона не допускаются.
  • Если количество секунд опущено (чтобы указать время с точностью до минуты), двоеточие не должно следовать за количеством минут.
  • Если указано, целая часть количества секунд должна быть между 00 и 59 . Вы не можете указать високосные секунды, используя такие значения, как 60 или 61 .
  • Если количество секунд указано и является целым числом, за ним не должно следовать десятичная точка.
  • Если включены доли секунды, это может быть от одной до трех цифр, указывающих количество миллисекунд. Он следует за десятичной точкой, расположенной после компонента секунд в строке времени.

Действительный 9Строка 0005 datetime-local состоит из строки даты и строки времени , объединенных буквой « T » или разделяющим их символом пробела. В строку не включается информация о часовом поясе; предполагается, что дата и время соответствуют местному часовому поясу пользователя.

Когда вы устанавливаете значение ввода datetime-local , строка нормализована в стандартную форму. Нормализованный 9В строках 0005 datetime всегда используется буква » T » для разделения даты и времени, а временная часть строки должна быть как можно короче. Это делается путем исключения компонента секунд, если его значение равно :00 .

Глобальная строка даты и времени указывает дату и время, а также часовой пояс, в котором она находится. Действительная глобальная строка даты и времени имеет тот же формат, что и локальная строка даты и времени, за исключением того, что в конце после времени добавляется строка часового пояса.

Строка смещения часового пояса

Строка смещения часового пояса указывает смещение в положительном или отрицательном числе часов и минут от стандартной временной базы. Существуют две стандартные базы времени, которые очень близки к одному и тому же, но не полностью совпадают:

  • Для дат после введения всемирного координированного времени (UTC) в начале 1960-х годов база времени равна Z , а offset указывает смещение конкретного часового пояса от времени нулевого меридиана на 0º долготы (который проходит через Королевскую обсерваторию в Гринвиче, Англия).
  • Для дат, предшествующих UTC, временная база вместо этого выражается в терминах UT1, что является современным земным солнечным временем в нулевом меридиане.

Строка часового пояса добавляется сразу после времени в строке даты и времени. Вы можете указать « Z » в качестве строки смещения часового пояса, чтобы указать, что время указано в формате UTC. В противном случае строка часового пояса строится следующим образом:

  1. Символ, указывающий знак смещения: знак плюса (» + «, или U+002B) для часовых поясов к востоку от нулевого меридиана или знак минус (« - «, или U+002D) для часовых поясов к западу от нулевого меридиана.
  2. Двузначное число часов, на которое часовой пояс смещен от нулевого меридиана. Это значение должно находиться в диапазоне от 00 до 23 .
  3. Необязательный символ двоеточия (« : «).
  4. Двузначное число минут после часа; это значение должно быть между 00 и 59 .

Хотя этот формат позволяет использовать часовые пояса между -23:59 и +23:59, текущий диапазон смещения часовых поясов составляет от -12:00 до +14:00, и часовые пояса в настоящее время не смещены относительно часа. кроме 00 , 30 или 45 минут. Это может измениться более или менее в любое время, поскольку страны могут свободно вмешиваться в свои часовые пояса в любое время и любым способом, которым они хотят это сделать.

  • <ввод>
  • и : см. атрибут datetime , который указывает либо дату, либо локальную дату и время, когда содержимое было вставлено или удалено
  • Спецификация ISO 8601
  • Числа и даты в руководстве по JavaScript
  • JavaScript Дата Объект
  • Объект Intl.DateTimeFormat для форматирования даты и времени для данной локали

Последнее изменение: , участниками MDN

Типы ввода даты и времени

Могу ли я использовать

Поиск

?

Типы ввода даты и времени

— ЛС

  • Глобальное использование
    76,04% + 20,89% знак равно 96,93%

Виджеты поля формы, позволяющие пользователям легко вводить дату, время или и то, и другое, как правило, с помощью виджета ввода календаря/времени. Относится к поддержке следующих типов ввода: дата , время , datetime-local , месяц и неделя .

Chrome
  1. 4 — 19: Not supported
  2. 20 — 24: Partial support
  3. 25 — 106: Supported
  4. 107: Supported
  5. 01% — Supported»> 108 — 110: Supported
Edge
  1. 12: Partial support
  2. 13–105: поддерживается
  3. 106: поддерживается
Safari
  1. 3.1–14: не поддерживается
  2. 14,1 — 16,0: частичная поддержка
  3. 16,1: Частичная поддержка
  4. 16,2 — TP: Частичная поддержка
Firefox
  1. 2 — 52: не поддерживается
  2. 53 — 56: 56: 56: 56: 56: 56: 56: 56: 56: 56, 56, 5, 900, 900, 900, 904,
      , 9048, 2, 9007,
        ,
      1. : 52: 52: 5,
        2. , 9007,
          ,
        1. 40% — Not supported»> 2 — 52: не поддерживают
          2. — 56: 5. Частичная поддержка
        2. 93 — 105: Частичная поддержка
        3. 106: Частичная поддержка
        4. 107 — 108: Частичная поддержка
        Opera
        1. 9 — 90: поддержано
        2. 00 91: поддержка
          3. 9 7777. 9007. 9007. 9007. 9007. 9007. 9007. 9007. 9007. 9007. 9007. 9007.

          . 9007.

          .

          .
        77. 9007. 9007.
      77.
    77.0350
  3. 5,5 - 10: не поддерживается
  4. 11: не поддерживается
Chrome для Android
  1. 106: Поддержано
Safari на IOS
  1. 3,2 - 4,3: не поддерживает
    2. - 9002 - 9002 - - 4002 - 9002 - 9005 - 9052 - 4002 - 9002 - 9002 - 9005 - - 4002 - - 9002 - - -
  2. 00% - Not supported">
  4. 3,
  5. 16.1: частичная поддержка
Samsung Internet
  1. 4 - 17.0: поддерживается
  2. 18.0: поддерживается
Opera Mini
    7 9037 9036
  1. все: не поддерживается Opera Mini0071
    1. 10 - 12.1: Supported
    2. 64: Supported
    UC Browser for Android
    1. 13.4: Supported
    Android Browser
    1. 2.1 - 3: Not supported
    2. 4 - 4.3: Not supported

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *