Тип ввода HTML5 Дата – значение по умолчанию для сегодняшнего дня?

Новые типы ввода HTML5 великолепны. Новый встроенный сборщик данных Opera – это легкий ветерок, и Chrome, по крайней мере, поддерживает новый тип ввода с реализацией спин-колеса.

Но есть ли способ установить значение по умолчанию для поля даты на сегодняшнюю дату? С Opera я могу выбрать «Сегодня» из списка выбора даты, и как только я нажимаю на любую из кнопок шага в Chrome, он увеличивает / уменьшает текущую дату.

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

Как и любое поле ввода HTML, браузер оставляет его пустым, если значение по умолчанию не задано атрибутом value .

К сожалению, HTML5 не предоставляет способ указания «сегодня» в атрибуте value (который я вижу), только действительная дата RFC3339, например, 2011-09-29 . Извините, это не помогает!

Объект JavaScript Date обеспечивает достаточную встроенную поддержку требуемого формата, чтобы избежать его вручную:

Добавьте это для правильной поддержки часового пояса:

 Date.prototype.toDateInputValue = (function() { var local = new Date(this); local.setMinutes(this.getMinutes() - this.getTimezoneOffset()); return local.toJSON().slice(0,10); }); 

JQuery:

 $(document).ready( function() { $('#datePicker').val(new Date().toDateInputValue()); });​ 

Pure JS:

 document.getElementById('datePicker').value = new Date().toDateInputValue(); 

это работает для меня:

 document.getElementById('datePicker').valueAsDate = new Date(); 

https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement

Следующий код работает хорошо:

  

Обратите внимание, что это зависит от PHP.

Вы можете заполнить значение по умолчанию через javascript, как показано здесь: http://jsfiddle.net/7LXPq/

 $(document).ready( function() { var now = new Date(); var month = (now.getMonth() + 1); var day = now.getDate(); if (month < 10) month = "0" + month; if (day < 10) day = "0" + day; var today = now.getFullYear() + '-' + month + '-' + day; $('#datePicker').val(today); }); 

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

EDIT: добавлена ​​проверка дополнительного нуля

Следуйте стандартным форматам Ymd, если вы используете PHP

 "> 

HTML

  

JS

 $(document).ready(function() { var date = new Date(); var day = date.getDate(); var month = date.getMonth() + 1; var year = date.getFullYear(); if (month < 10) month = "0" + month; if (day < 10) day = "0" + day; var today = year + "-" + month + "-" + day; $("#theDate").attr("value", today); }); 

демонстрация

Если вы не хотите использовать jQuery, вы можете сделать что-то вроде этого

HTML

  

JS

 var date = new Date(); var day = date.getDate(); var month = date.getMonth() + 1; var year = date.getFullYear(); if (month < 10) month = "0" + month; if (day < 10) day = "0" + day; var today = year + "-" + month + "-" + day; document.getElementById("theDate").value = today; 

демонстрация

В HTML5 как таковой не существует способа установить значение по умолчанию для поля даты на сегодняшний день? Как показано в других ответах, значение может быть установлено с помощью JavaScript, и это обычно лучший подход, если вы хотите установить значение по умолчанию в соответствии с текущей датой для пользователя при загрузке страницы.

HTML5 определяет свойство valueAsDate для элементов input type=date и использует его, вы можете установить начальное значение непосредственно из созданного объекта, например, с помощью new Date() . Однако, например, IE 10 не знает этого свойства. (Он также не имеет подлинной поддержки input type=date , но это другая проблема.)

Поэтому на практике вам нужно установить свойство value , и оно должно соответствовать ISO 8601. В настоящее время это можно сделать довольно легко, поскольку мы можем ожидать, что текущие браузеры будут поддерживать метод toISOString :

   

Если вы делаете что-то, связанное с датой и временем в браузере, вы хотите использовать Moment.js :

 moment().format('YYYY-MM-DD'); 

moment() возвращает объект, представляющий текущую дату и время. Затем вы вызываете его .format() для получения строкового представления в соответствии с указанным форматом. В этом случае, YYYY-MM-DD .

Полный пример:

   

Очень просто, просто используйте серверные языки, такие как PHP, ASP, JAVA или даже вы можете использовать javascript.

Вот решение

       

используйте moment.js, чтобы решить эту проблему в 2 строках, тип ввода даты html5 принимает только этот формат «ГГГГ-ММ-ДД». Я решаю свою проблему таким образом.

 var today = moment().format('YYYY-MM-DD'); $('#datePicker').val(today); 

это самый простой способ решить эту проблему.

если вам нужно заполнить ввод datetime, вы можете использовать это:

  

Это то, что я сделал в своем коде, я только что протестировал и работал нормально, input type = «date» не поддерживает автоматическое определение curdate, поэтому способ, которым я использовал это ограничение, заключался в том, что PHP-код был простым кодом, подобным этому ,

    
Data de submissão"; echo ""; ?>

Надеюсь, поможет!

по Javascript:

 var today = new Date(); document.getElementById("theDate").value = today.getFullYear() + '-' + ('0' + (today.getMonth() + 1)).slice(-2) + '-' + ('0' + today.getDate()).slice(-2); 
 new Date().getFullYear()+"-"+ ((parseInt(new Date().getMonth())+1+100)+"").substring(1) 

Для NodeJS (Express с шаблонами SWIG):

  

Поскольку метод установки по умолчанию для сегодняшней даты не существует, я бы сказал, что это должно зависеть от его приложения. Если вы хотите максимизировать доступ аудитории к сборщику даты, используйте сценарий на стороне сервера (PHP, ASP и т. Д.), Чтобы установить значение по умолчанию.

Однако, если это для консоли администрирования CMS, и вы знаете, что пользователь всегда будет доверять JS или вашему сайту, тогда вы можете безопасно использовать JS для заполнения значения по умолчанию, как в jlbruno.

У меня была та же проблема, и я исправил ее с помощью простого JS. Вход:

  

JS

  

Важно: сценарий JS должен находиться в последней строке кода или после ввода, потому что если вы поместите этот код раньше, сценарий не найдет ваш вход.

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

Вы можете использовать PHP для извлечения текущей даты и ввода ее в поле значения элемента формы.

 "; ?> 

Поле значения принимает формат YYYY-MM-DD как вход так просто, создав переменную $date_string в том же формате, в котором принимается входное значение, и заполняет его годом, месяцем и днем, полученным с сегодняшней даты и voilá! У вас есть выбранная дата!

Надеюсь это поможет 🙂

Редактировать:

Если вы хотите, чтобы поле ввода было вложено внутри HTML, а не PHP, вы могли бы сделать следующее.

   ...  

Я понимаю, что этот вопрос был задан некоторое время назад (2 года назад), но мне все же потребовалось некоторое время, чтобы найти определенный ответ в Интернете, так что это будет служить любому, кто ищет ответ, когда это возможно, и надеемся, что это помогает всем очень 🙂

Другое Редактировать:

Почти забыл, что в прошлом для меня была королевская боль, всегда забывайте установить часовой пояс по умолчанию, когда вы создаете скрипт на PHP, который использует функцию date ().

Синтаксис: date_default_timezone_set(...); , Документацию можно найти здесь, на PHP.net, и список поддерживаемых часовых поясов для вставки в эту функцию можно найти здесь . Это всегда было неприятно, так как я нахожусь в Австралии, все всегда откладывается на 10 часов, если я не установил это правильно, поскольку он по умолчанию имеет UTC + 0000, где мне нужен UTC + 1000, поэтому просто будьте осторожны 🙂

Спасибо, Питер, теперь я меняю свой код.

   

Вот простой способ сделать это с помощью javascript.

  var date = new Date(); var datestring = ('0000' + date.getFullYear()).slice(-4) + '-' + ('00' + (date.getMonth() + 1)).slice(-2) + '-' + ('00' + date.getDate()).slice(-2) + 'T'+ ('00' + date.getHours()).slice(-2) + ':'+ ('00' + date.getMinutes()).slice(-2) +'Z'; document.getElementById('MyDateTimeInputElement').value = datestring; 

Если вы используете ruby, вы можете использовать это, чтобы установить значение по умолчанию для сегодняшней даты и времени:

  

Простое решение!

   
  
 $(document).ready( function() { var now = new Date(); var day = ("0" + now.getDate()).slice(-2); var month = ("0" + (now.getMonth() + 1)).slice(-2); var today = now.getFullYear()+"-"+(month)+"-"+(day) ; $('#datePicker').val(today); }); 
   

А для тех, кто использует ASP VBScript

 <% 'Generates date in yyyy-mm-dd format Function GetFormattedDate(setDate) strDate = CDate(setDate) strDay = DatePart("d", strDate) strMonth = DatePart("m", strDate) strYear = DatePart("yyyy", strDate) If strDay < 10 Then strDay = "0" & strDay End If If strMonth < 10 Then strMonth = "0" & strMonth End If GetFormattedDate = strYear & "-" & strMonth & "-" & strDay End Function %> 

И тогда в теле ваш элемент должен выглядеть примерно так

  

Ура!

  • Как получить формат строки даты (шаблон) в java?
  • Java: исключение исключаемых дат
  • Разница между java HH: mm и hh: mm на SimpleDateFormat
  • Форматирование DATE в oracle
  • Используя дату в контрольном ограничении, Oracle
  • Разница в месяцах между датами в MySQL
  • Как изменить несколько форматов даты в одном столбце
  • Android DatePicker изменится только на месяц и год
  • Изменение формата даты на «% d /% m /% Y»
  • Как анализировать дату в Date?
  • Изменение формата даты на yyyy-mm-dd
  • Давайте будем гением компьютера.