Wie setzt man den Standardwert des Eingabetyps Datum auf heute?

Question

Gegeben ein Eingabeelement:

<input type="date" />

Gibt es eine Möglichkeit, den Standardwert des Datumsfelds auf das heutige Datum zu setzen?

Answer 1

In HTML5 gibt es keine Möglichkeit, den Standardwert des Datumsfeldes auf das heutige Datum zu setzen? Wie in anderen Antworten gezeigt, kann der Wert mit JavaScript festgelegt werden, und dies ist in der Regel der beste Ansatz, wenn Sie den Standardwert entsprechend dem aktuellen Datum für den Benutzer festlegen möchten, wenn die Seite geladen wird.

HTML5 definiert die valueAsDate Eigenschaft für input type=date Elemente, und damit könnten Sie den Anfangswert direkt von einem Objekt setzen, das z. B. durch new Date() . Allerdings kennt z. B. IE 10 diese Eigenschaft nicht. (Es fehlt auch eine echte Unterstützung für input type=date aber das ist ein anderes Thema).

In der Praxis müssen Sie also die value und muss in einer ISO 8601-konformen Notation angegeben werden. Heutzutage ist dies relativ einfach zu bewerkstelligen, da wir davon ausgehen können, dass die derzeit verwendeten Browser die toISOString Methode:

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

Answer 2

Befolgen Sie das Standardformat Y-m-d, wenn Sie PHP verwenden

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

Answer 3

HTML

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

JQuery

$(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 +"T00:00";       
    $("#theDate").attr("value", today);
});

Demo

Wenn Sie jQuery nicht verwenden möchten, können Sie wie folgt vorgehen

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;

Demo

TS

const date = new Date()
const year = date.getFullYear()

let month: number | string = date.getMonth() + 1
let day: number | string = date.getDate()

if (month < 10) month = '0' + month
if (day < 10) day = '0' + day

const today = `${year}-${month}-${day}`    
document.getElementById("theDate").value = today;

Answer 4

HTML:

<input type="date" value="2022-01-31">

PHP:

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

Das Datumsformat muss sein " jjjj-mm-tt "

Answer 5

Wenn Sie irgendetwas im Zusammenhang mit Datum und Uhrzeit im Browser tun, sollten Sie Moment.js :

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

moment() gibt ein Objekt zurück, das das aktuelle Datum und die aktuelle Uhrzeit darstellt. Sie rufen dann dessen .format() Methode, um eine Zeichenkettendarstellung gemäß dem angegebenen Format zu erhalten. In diesem Fall, YYYY-MM-DD .

Vollständiges Beispiel:

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