Når brukere er pålagt å angi en dato, setter utviklere den forhåndsdefinerte/standardverdien for en inndatatypedato til gjeldende/i dag. Nå trenger ikke brukeren å legge inn datoen manuelt, så i den forstand sparer det tid og krefter for brukeren. Dessuten forbedrer det brukeropplevelsen, nøyaktigheten til dataene og gir mer bekvemmelighet for brukerne. Den har ulike applikasjoner som et event management system, bookingsystem, etc.
Denne bloggen viser hvordan du setter inndatatypens standardverdi til i dag:
- Bruk av egenskapen 'valueAsDate'.
- Ved å bruke 'toISOString()'-metoden
- Ved å bruke metodene 'getFullYear()' og 'padStart()'.
Metode 1: Bruk av egenskapen 'valueAsDate'.
« valueAsDate '-egenskapen brukes til å hente gjeldende dato gjennom ' Dato() ' funksjon. Denne funksjonen brukes til å utføre ulike operasjoner på en dato og som å få gjeldende dato, angi en spesifikk dato, manipulere datoer, etc.
Besøk koden nedenfor for en bedre forståelse:
< kropp >
< div >
< merkelapp til = 'dato i dag' > Datoen er merkelapp >< input type = 'Dato'
id = 'dato i dag' >
div >
< manus >
document.getElementById ( 'dato i dag' ) .valueAsDate = ny dato ( ) ;
manus >
kropp >
I kodebiten ovenfor:
- Først, ' '-taggen er opprettet med ' type ' og ' id '-attributter satt til ' data ' og ' dags dato 'henholdsvis. Denne « »-taggen kommer til å bli brukt gjennom hele bloggen.
- Deretter inne i ' ' tag HTML-elementet med en id på ' dags dato ' velges med ' getElementById() 'metoden.
- Etter det, ' valueAsDate ' egenskap tildeles og lagres som en forekomst av en ny ' Dato() ' konstruktør.
Etter utførelse av kodebiten ovenfor, ser nettsiden slik ut:
Utdataene viser at inputtypedataene har en standardverdi satt til gjeldende/i dag dato.
Metode 2: Bruke 'toISOString()'-metoden
For å angi standard i dag-verdi for ' input ' element til i dag/gjeldende dato. « toISOString() ”-metoden kan også brukes, for en bedre forklaring besøk under kodebiten:
< manus >const i dag = ny dato ( ) .toISOSring ( ) .substr ( 0 , 10 ) ;
document.getElementById ( 'dato i dag' ) .verdi = i dag;
manus >
I kodebiten ovenfor:
- Først den nye forekomsten av ' Dato() ” konstruktør er opprettet. Etter det, konverter forekomsten av datoen til ' ISO ' standard ved å bruke ' toISOString() 'metoden.
- Deretter bruker du ' substr() ' metode som tar indekstall av ' 0 ' og ' 10 ' som en parameter. Etter det viser den resultatet fra ' 0 ' indeks til ' 10 ' indeks.
Etter utførelse av metoden ovenfor, ser nettsiden slik ut:
Utdataene viser at inputtypedataene har en standardverdi satt til gjeldende/i dag dato.
Metode 3: Bruke metodene 'getFullYear()' og 'padStart()'.
I denne delen, ' getFullYear() ”-metoden trekker ut gjeldende dato. « pathStart() '-metoden brukes som hjelper med å formatere ' Dato '-format som vil bli vist på den målrettede ' input ' element:
< manus >konst nåværende = ny dato ( ) ;
const gjeldende år = gjeldende.getFullYear ( ) ;
const gjeldende-måned = String ( gjeldende.getMonth ( ) + 1 ) .padStart ( 2 , '0' ) ;
const gjeldende dag = streng ( gjeldende.getDate ( ) ) .padStart ( 2 , '0' ) ;
const formattedDate = ` ${current-year} - ${current-month} - ${current-day} ` ;
const myDateInput = document.getElementById ( 'min date' ) ;
myDateInput.value = formattedDate;
manus >
Beskrivelsen av kodebitene ovenfor er beskrevet i punkttegn:
- Lag først en konstant type variabel som lagrer objektet til ' Dato() ' konstruktør med navnet ' nåværende '.
- Deretter bruker du ' getFullYear() '-metoden med ' nåværende ' variabel og lagre den i en ny variabel kalt ' Dette året '.
- Send deretter ' getMonth() '-metoden og legg til ett tall for å starte måneden fra 1 til 12 i ' String() ' konstruktør. Gi også en utfylling av to tegn ved å bruke ' pathStart(2, 0) '. Og plasser den i en nyopprettet variabel kalt ' denne måneden '.
- Deretter følger du samme prosess for å få gjeldende dato ved å bruke ' getDate() '-metoden og lagre den i ' gjeldende dag variabel.
Etter utførelse av kodebitene, ser nettsiden i hvert tilfelle slik ut:
Utdataene viser at inputtypedataene har en standardverdi satt til gjeldende/i dag dato.
Konklusjon
For å sette inndatatypens standardverdi til i dag/gjeldende dato, ' valueAsDate ' eiendom, ' toISOString() ' og ' getFullYear() metoder kan brukes. Når det gjelder egenskapen 'valueAsDate', er det bare ' Dato() ' konstruktør er nødvendig når det gjelder ' toISOString() 'metoder' substr() ”-metoden brukes for å få bare en bestemt del av datoen. Denne bloggen viser hvordan du setter standardverdien for dato for inputtype til i dag/gjeldende.