javascript - Sett maksimumsdato for datainndatfeltet til i dag

Jeg har bare en enkel kodelinje som dette:

<input type='date' min='1899-01-01' max='2000-01-01'>

Finnes det en enkel måte å sette maksimal dato til "i dag" i stedet for 2000-01-01? Eller må jeg bruke Javascript for å gjøre dette?

Svar #1

Kun enkel JavaScript-løsning

datePickerId.max = new Date().toISOString().split("T")[0];
<input type="date" id="datePickerId" />
// below trick also works! Thanks jymbob for the comment.
datePickerId.max = new Date().toLocaleDateString('fr-ca')

Svar #2

Du vil trenge Javascript for å gjøre dette:

HTML

<input id="datefield" type='date' min='1899-01-01' max='2000-13-13'></input>

JS

var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();

if (dd < 10) {
   dd = '0' + dd;
}

if (mm < 10) {
   mm = '0' + mm;
} 
    
today = yyyy + '-' + mm + '-' + dd;
document.getElementById("datefield").setAttribute("max", today);

JSFiddle-demo

Svar #3

I stedet for Javascript kunne en kortere PHP-basert løsning være:

 <input type="date" name="date1" max="<?= date('Y-m-d'); ?>">

Svar #4

Javascript vil være påkrevd; for eksempel:

$(function(){
    $('[type="date"]').prop('max', function(){
        return new Date().toJSON().split('T')[0];
    });
});

JSFiddle-demonstrasjon

Svar #5

Hvis du ikke vil bruke eksterne skript, men heller sette max-grensen direkte i HTML-inntastingselementet, inline slik:

<input type="date" max="3000-01-01" onfocus="this.max=new Date().toISOString().split('T')[0]" />

Jeg har bevisst lagt til max-attributtet med en dato langt inn i fremtiden, fordi det ser ut til at Chrome-nettleseren endrer bredden på feltet når et max-attributt er satt, så for å unngå det hadde jeg det forhåndsinnstilt.

Se live-demo

Relaterte artikler