Как установить значение даты по умолчанию для типа ввода сегодня?

Ответ 1

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

К сожалению, HTML5 не предоставляет способ указания "сегодня" в атрибуте value (что я вижу), только действительная дата RFC3339, как 2011-09-29.

TL; DR Используйте формат даты YYYY-MM-DD, иначе он не будет отображаться

Ответ 2

Объект 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();

Ответ 3

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

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

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

Ответ 4

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

<input type="date" value="<?php echo date('Y-m-d'); ?>" />

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

Ответ 5

Вы можете заполнить значение по умолчанию через 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);
});

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

РЕДАКТИРОВАТЬ: Добавлена проверка на дополнительный ноль

Ответ 6

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

<input type="date" value="<?php echo date("Y-m-d"); ?>">

Ответ 7

HTML

<input type="date" id="theDate">

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

<input type="date" id="theDate">

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;

демо

Ответ 8

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

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

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

<input type=date id=e>
<script>
document.getElementById('e').value = new Date().toISOString().substring(0, 10);
</script>

Ответ 9

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

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

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

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

<input id="today" type="date">
<script>
document.getElementById('today').value = moment().format('YYYY-MM-DD');
</script>

Ответ 10

Возможное решение

document.getElementById("yourDatePicker").valueAsDate = new Date()

JSFiddle пример

Ответ 11

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

Вот решение

<?php
  $timezone = "Asia/Colombo";
  date_default_timezone_set($timezone);
  $today = date("Y-m-d");
?>
<html>
  <body>
    <input type="date" value="<?php echo $today; ?>">
  </body>
</html>

Ответ 12

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

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

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

Ответ 13

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

<input type="datetime-local" name="datetime" 
       value="<?php echo date('Y-m-d').'T'.date('H:i'); ?>" />

Ответ 14

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

<html>
<head></head>
    <body>
        <form ...>
            <?php
                echo "<label for='submission_date'>Data de submissão</label>";
                echo "<input type='date' name='submission_date' min='2012-01-01' value='" . date('Y-m-d') . "' required/>";
            ?>
        </form>
    </body>
</html>

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

Ответ 15

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

<input type="date" id="aDate" name="aDate" class="form-control" value="{{ Date.now() | date("Y-m-d") }}" />

Ответ 16

<input id="datePicker" type="date" />

$(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);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="datePicker" type="date" />

Ответ 17

В простейших решениях, как представляется, не учитывается время UTC, в том числе с высоким рейтингом. Ниже приведена упрощенная версия ES6, не являющаяся jQuery, пары существующих ответов:

const today = (function() {
    const now = new Date();
    const month = (now.getMonth() + 1).toString().padStart(2, '0');
    const day = now.getDate().toString().padStart(2, '0');
    return '${now.getFullYear()}-${month}-${day}';
})();
console.log(today); // as of posting this answer: 2019-01-24

Ответ 18

по Javascript:

var today = new Date();

document.getElementById("theDate").value = today.getFullYear() + '-' + ('0' + (today.getMonth() + 1)).slice(-2) + '-' + ('0' + today.getDate()).slice(-2);

Ответ 19

new Date().getFullYear()+"-"+ ((parseInt(new Date().getMonth())+1+100)+"").substring(1)

Ответ 20

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

Значение даты в формате HTML должно быть в следующем формате: гггг-мм-дд, иначе значение не будет отображаться.

ASP CLASSIC, ИЛИ VBSCRIPT:

current_year = DatePart("yyyy",date) 
current_month = DatePart("m",date) 
current_day = DatePart("d",date) 

IF current_month < 10 THEN
current_month = "0"&current_month
END IF
IF current_day < 10 THEN
current_day = "0"&current_day
END IF

get_date = current_year&"-"&current_month&"-"&current_day
Response.Write get_date

Выходной день на сегодня: 2019-02-08

Тогда в вашем html: <input type="date" value="<% =get_date %>"

PHP

просто используйте это: <input type="date" value="<?php echo date("Ymd");?>">

Ответ 21

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

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

Ответ 22

И для тех, кто использует 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
%>

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

<input name="today" type="date" value="<%= GetFormattedDate(now) %>" />

Ура!

Ответ 23

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

<input type='date' id='d1' name='d1'>

<script type="text/javascript">
var d1 = new Date();
var y1= d1.getFullYear();
var m1 = d1.getMonth()+1;
if(m1<10)
    m1="0"+m1;
var dt1 = d1.getDate();
if(dt1<10)
dt1 = "0"+dt1;
var d2 = y1+"-"+m1+"-"+dt1;
document.getElementById('d1').value=d2;
</script>

Ответ 24

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

<input type="date" name="dateOrder" id="dateOrder"  required="required">

JS

<script language="javascript">
document.getElementById('dateOrder').value = "<?php echo date("Y-m-d"); ?>";
</script>

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

Ответ 25

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

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

<?php
    // Fetch the year, month and day
    $year = date(Y);
    $month = date(m);
    $day = date(d);

    // Merge them into a string accepted by the input field
    $date_string = "$year-$month-$day";

    // Send to the browser the input field with the value set with the date string
    echo "<input type='date' value='$date_string' />";
?>

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

Надеюсь, что это поможет:)

Edit:

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

<?php
    // Fetch the year, month and day
    $year = date(Y);
    $month = date(m);
    $day = date(d);

    // Merge them into a string accepted by the input field
    $date_string = "$year-$month-$day";
?>
<html>
    <head>...</head>
    <body>
        <form>
            <input type="date" value="<?php print($date_string); ?>" />
        </form>
    </body>
</html>

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

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

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

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

Ответ 26

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

<input type="datetime-local" name="time" value="<%= Time.now.strftime('%Y-%m-%dT%H:%M') %>" />

Ответ 27

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

<input class="set-today" type="date">
<script type="text/javascript">
window.onload= function(){
document.querySelector('.set-today').value=(new Date()).toISOString().substr(0,10));
}
</script>

Ответ 28

Оба топовых ответа неверны.

Короткий однострочный текст, который использует чистый JavaScript, учитывает локальный часовой пояс и не требует определения дополнительных функций:

const element = document.getElementById('date-input');
element.valueAsNumber = Date.now()-(new Date()).getTimezoneOffset()*60000;

<input id='date-input' type='date'>

Ответ 29

Javascript

document.getElementById('date-field').value = new Date().toISOString().slice(0, 10);

Jquery

$('#date-field').val(new Date().toISOString().slice(0, 10));

Другой вариант

Если вы хотите настроить дату, месяц и год, просто сделайте сумму или сабвуфер, как хотите 😎 Для месяца начинается с 0, поэтому необходимо суммировать 1 с месяцем.

function today() {
        let d = new Date();
        let currDate = d.getDate();
        let currMonth = d.getMonth()+1;
        let currYear = d.getFullYear();
        return currYear + "-" + ((currMonth<10) ? '0'+currMonth : currMonth )+ "-" + ((currDate<10) ? '0'+currDate : currDate );
    }

Применить функцию сегодня

document.getElementById('date-field').value = today();

$('#date-field').val(today());

Ответ 30

Вот простой способ сделать это с помощью 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;