HTML5, тип ввода datetime vs datetime-local, какой мне следует использовать?

Question

Я не могу найти больше различий, как по возвращаемому значению ...

"2011-10-18T00:00:00.00Z" // datetime value 

"2011-10-18T00:00:00.00" // datetime-local value

Я что-то упустил?

Answer 1

Обновление: W3C добавил type@datetime-local назад и исключил поддержку type@datetime - браузеры теперь отображают дату и время как обычный текст: см. Почему HTML5-тип ввода datetime удален из браузеров, уже поддерживающих его

Старый ответ для справки

Надеюсь, вы не выбрали datetime-local. : -)

W3C HTML отбросил тип ввода @ datetime-local; "мало независимых ценность и источник потенциальной путаницы разработчика "

Источник: https://twitter.com/html5/status/433038890937901056

История процесса здесь: http://encosia.com/setting-the-value-of-a-datetime-local-input-with-javascript/

Была некоторая запутанная нестабильность вокруг datetime входов, так как HTML5 объединился в рекомендацию.

Ранее спецификация W3c HTML5 просто предлагала ввод datetime. Начиная с iOS 5, Mobile Safari начал отображать пользовательский интерфейс для этого ввода, который соответствует тому, который вы найти в родных приложениях. Другие мобильные браузеры быстро последовали их примеру.

Позже datetime был удален из проекта спецификации HTML5 в пользу объединяя отдельные данные даты и времени, чтобы предложить пользователям значение даты / времени с двумя отдельными входами. Сокращая количество новые типы ввода имеют некоторый смысл, он игнорирует полезность показа комбинированный виджет даты / времени, который уже присутствует и знаком мобильные устройства.

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

В конце 2014 года W3C решил отказаться от datetime-local от Рекомендация HTML5 spec, потому что это может привести к путанице. Тем не мение, доминирующие мобильные браузеры (то есть Mobile Safari и Chrome) имели уже реализовал datetime-local и сделал его стандартом де-факто. Итак, w3C смягчился и добавил его к последней рекомендации. проект.

Добавляя к путанице немного больше, Apple по-прежнему перечисляет оба datetime и datetime-local как поддерживаемые типы ввода для iOS 5.0 и потом. Это не совсем так, хотя. Начиная с iOS 7, Mobile Safari начал показывать свой родной интерфейс для ввода даты и времени и прекращена поддержка ввода даты и времени одновременно. Как с любым тип ввода, для которого браузер не имеет расширенной поддержки, datetime входные данные начали возвращаться к полям простого текста на iOS 7.

Короче говоря, вы должны использовать datetime-local для iOS 7+ (по крайней мере, через текущая версия 8.1.3, как я пишу это), и это полезно для понимать, что «локальный» означает, что ввод не зависит от часового пояса.

Answer 2

Разница между ними заключается в том, что местный ввод даты и времени не включает часовой пояс.Если часовой пояс не важен для вашего приложения, используйте datetime-local.

Некоторые браузеры все еще пытаются определить тип ввода datetime.Firefox 7 до сих пор не показал никакого прогресса в этой области.Вместо этого настройте свои собственные, используя три поля выбора с параметрами, которые заполняются относительно текущей даты.Это дает вам гораздо больший контроль над тем, как он на самом деле выглядит и ведет себя, и вы не рискуете, когда многие ваши пользователи увидят только обычные текстовые поля и будут гадать, как вводить в них информацию.

Answer 3

Посмотрите на поля ввода даты HTML5 на iOS5 или на Google Chrome для Android, это довольно круто. Оба поддерживают типы date, datetime, datetime-local, time, month, отсутствует только неделя. Специально для мобильных / сенсорных клиентов поддержка нового времени ввода очень важна. Для моего приложения я покажу календарь на основе js / html (например, dynarch) или поле ввода html5 в зависимости от клиента.

Answer 4

Код ниже показывает календарь из поля ввода во всех браузерах.Вставьте код в начало страницы.

<link ref="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>  
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>  
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 

<script type="text/javascript">
$(function() {
    $("#datepicker").datepicker({ dateFormat: "mm-dd-yy" }).val()
});

$('#event_date').datepicker({
    showButtonPanel: true,
    dateFormat: "mm/dd/yy",
    beforeShow: function() {    
        $(".ui-datepicker").css('font-size', 12) 
    }
});
</script>

<style>
div.ui-datepicker, .ui-datepicker input {
    font-size:35%;
    line-height: .6;
}
</style>

Answer 5

Вот более свежий (от 23 апреля 2017 г.) и окончательный ответ (выделен жирным шрифтом) за MDN:

Устаревшие

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

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

Вместо этого браузеры реализуют (и разработчикам рекомендуется использовать) локальный тип ввода datetime.

Источник