Dit artikel demonstreert het gebruik van het invoertype=“date” in HTML, samen met de praktische implementatie.
Hoe invoertype=”date” in HTML te gebruiken?
Het 'input type='data'' kan op verschillende websites worden gebruikt, zoals websites voor gezondheidszorg, websites voor het boeken van luchtvaartmaatschappijen, websites voor e-commerce, sociale netwerksites, enz. De syntaxis van de datumkiezer wordt hieronder vermeld:
< invoer type = 'datum' ID kaart = '' naam = '' >
De kenmerken die in de bovenstaande codefragmenten worden gebruikt, zijn:
- Eerst de ' type Met het attribuut kan het invoerveld fungeren als een datumkiezer waaruit de gebruiker elke gewenste datum kan kiezen.
- Vervolgens de “ ID kaart ” attribuut definieert het unieke karakter van dat element. Door het te gebruiken, kan het element worden geselecteerd en kan het JavaScript-functionaliteit toepassen.
- Daarna is de “ naam ” attribuut specificeert de naam van dat element. Het biedt hulp bij het validatieproces voor het verkrijgen van de waarde van het geselecteerde element.
Laten we, om het begripsniveau te vergroten, verschillende voorbeelden doornemen:
Voorbeeld 1: Type= “date” gebruiken in HTML
Maak in het HTML-bestand een '
< formulier >
< etiket voor = 'joinDate' > Selecteer uw datum van deelname: < / etiket >
< invoer type = 'datum' ID kaart = 'joinDate' naam = 'joinDate' >
< / formulier >
In het bovenstaande codefragment:
- Eerst de '
” tag wordt gebruikt waarin dummy-gegevens worden geplaatst en de waarde van “ joinDate ” is verstrekt aan de “ voor ” attribuut. - Vervolgens de “
” tag wordt gebruikt met een waarde van “ datum ' naar zijn ' type ” attribuut. - Stel daarna de waarde in van ' joinDate ' naar de ' ID kaart ” attribuut. Stel ook de waarde in van de ' naam ” attribuut volgens de behoefte.
Na de uitvoering van het bovenstaande codefragment ziet de webpagina er als volgt uit:
De bovenstaande gif illustreert dat de datumkiezer is gemaakt met invoertype = 'data' in HTML.
Voorbeeld 2: datum ophalen met behulp van JavaScript
Om de gegevens op te halen, kunnen gebruikers JavaScript-functionaliteiten gebruiken. Ga voor een beter begrip naar het onderstaande codeblok:
< knop bij klikken = 'Datum ophalen()' >Datum ophalen< / knop >< script type = 'tekst/javascript' >
functie ophalenDatum ( ) {
was datumInput = document.getElementById ( 'joinDate' ) ;
var geselecteerde datum = datumInvoer. waarde ;
alarm ( 'Geselecteerde datum: ' + geselecteerde datum ) ;
}
< / script >
In het bovenstaande codefragment:
- Eerst de ' ophalenDatum() ” functie is gemaakt in de “