Šiame straipsnyje parodomas input type=“date“ naudojimas HTML ir praktinis įgyvendinimas.
Kaip naudoti įvesties tipą = 'date' HTML?
Įvesties tipas = „duomenys“ gali būti naudojamas įvairiose svetainėse, pvz., sveikatos priežiūros svetainėse, oro linijų užsakymo svetainėse, el. prekybos svetainėse, socialinių tinklų svetainėse ir kt. Datos rinkiklio sintaksė nurodyta toliau:
< įvestis tipo = 'data' id = '' vardas = '' >
Aukščiau pateiktuose kodo fragmentuose naudojami atributai:
- Pirma, „ tipo ” atributas leidžia įvesties laukui veikti kaip datos rinkikliui, iš kurio vartotojas gali pasirinkti bet kurią datą.
- Toliau „ id “ atributas apibrėžia to elemento unikalumą. Jį naudojant elementą galima pasirinkti ir pritaikyti JavaScript funkcionalumą.
- Po to „ vardas “ atributas nurodo to elemento pavadinimą. Tai padeda patvirtinimo procese, norint gauti pasirinkto elemento vertę.
Norėdami pagerinti supratimo lygį, panagrinėkime įvairius pavyzdžius:
1 pavyzdys: Type= „date“ naudojimas HTML
HTML faile sukurkite „
< forma >
< etiketė dėl = 'įstojimo data' > Pasirinkite savo prisijungimo datą: < / etiketė >
< įvestis tipo = 'data' id = 'įstojimo data' vardas = 'įstojimo data' >
< / forma >
Aukščiau pateiktame kodo fragmente:
- Pirma, „
Naudojama žyma, kurioje pateikiami netikri duomenys ir reikšmė įstojimo data “ buvo pateikta „ dėl “ atributas. - Toliau „ <įvestis> žyma naudojama su reikšme data 'į savo' tipo “ atributas.
- Po to nustatykite reikšmę ' įstojimo data “ į „ id “ atributas. Taip pat nustatykite „ vardas ” atributas pagal poreikį.
Įvykdžius aukščiau pateiktą kodo fragmentą, tinklalapis atrodo taip:
Aukščiau pateiktas gif iliustruoja, kad datos rinkiklis buvo sukurtas naudojant input type= „data“ HTML.
2 pavyzdys: datos paieška naudojant JavaScript
Norėdami gauti duomenis, vartotojai gali naudoti „JavaScript“ funkcijas. Norėdami geriau suprasti, apsilankykite toliau pateiktame kodo bloke:
< mygtuką paspaudus = 'RetrieveDate()' >Gauti datą< / mygtuką >< scenarijus tipo = 'tekstas/javascript' >
funkcija retrieveDate ( ) {
buvo dateInput = document.getElementById ( 'įstojimo data' ) ;
var pasirinktasDate = datos įvedimas. vertė ;
budrus ( 'Pasirinkta data: ' + pasirinkta data ) ;
}
< / scenarijus >
Aukščiau pateiktame kodo fragmente:
- Pirma, „ RetrieveDate () funkcija yra sukurta viduje