Reaalajas projektide (nt uudiskirjaga registreerumine, kontaktivormid, kassavormid ja kasutajate sisselogimised) loomiseks email ” väli on kohustuslik. Kasutaja peab protsessi jätkamiseks või alustamiseks sisestama oma e-posti aadressi ja ka oma kontole sisselogimiseks. Selleks peab kasutaja iga kord sisestama e-posti sisselogimise või registreeruma, mis muudab selle kasutajakogemuse halvaks. See probleem lahendatakse JavaScripti HTML-i DOM-i automaatse täitmise atribuudi abil.
See ajaveeb selgitab JavaScripti HTML DOM-i sisendmeilide automaatse täitmise atribuudi käsitlemise protseduuri.
Kuidas käsitleda HTML-i DOM-i sisendmeilide automaatse täitmise atribuuti?
HTML DOM-i sisendi automaatse täitmise atribuut ' email element, pakub loendit, mis sisaldab kõige värskemaid andmeid, mis on varem sisestatud email ” väljale. See võimaldab kasutajal valida oma e-posti loendist, kui see on automaatselt saadaval.
Süntaks
DOM-i sisendmeili automaatse täitmise atribuudi süntaks on toodud allpool.
emailObj. automaatne täitmine = 'sees|väljas'
Ülaltoodud süntaks määrab ja eemaldab elemendi emailObj automaatse täitmise atribuudi.
emailObj. automaatne täitmine
See süntaks hangib väärtuse ' automaatne täitmine ” atribuut, et teada saada, kas see atribuut on lubatud või mitte.
Kasutage automaatse täitmise atribuudi jaoks JavaScripti programmi
Näide: automaatse täitmise atribuudi väärtuse lubamine, keelamine ja toomine
Selles näites keelatakse automaatse täitmise atribuut, mille lubamiseks määrate selle atribuudi väärtuseks ' peal ” ja „ väljas ” vastavalt. Seejärel hangitakse automaatse täitmise atribuudi praegune väärtus:
< keha >< Keskus >
< h1 stiilis = 'värv: kadetsinine;' > Linux < / h1 >
E-post: < sisend tüüp = 'e-post' id = 'demoEmail' >
< br >
< br >
< nuppu onclick = 'Keela ()' > Keelaja < / nuppu >
< nuppu onclick = 'Lubaja()' > Lubaja < / nuppu >
< h3 id = 'sihtmärk' > < / h3 >
< nuppu onclick = 'Checker()' > Kontrollija < / nuppu >
< / Keskus >
< stsenaarium >
function Disabler() {
document.getElementById('demoEmail').autocomplete = 'off';
}
function Enabler() {
document.getElementById('demoEmail').autocomplete = 'sees';
}
function Checker() {
var j = document.getElementById('demoEmail').autocomplete;
document.getElementById('target').innerHTML = j;
}
< / stsenaarium >
< / keha >
Ülaltoodud koodiploki selgitus on toodud allpool:
- Esiteks, ' sisend ' element luuakse atribuudi tüübiga ' email ”, et nõustuda ja teostada põhiline valideerimine, veendumaks, et sisestatud andmed on meil.
- Järgmisena luuakse kolm nupuelementi, mis kutsuvad Disabler()”, „Enabler()” ja „Checker() ” funktsioonid.
- Nüüd määrake ' Keelaja ()” funktsiooni, valides „ sisend ' element, kasutades oma ID-d ja määrates väärtuse ' väljas 'selle' jaoks automaatne täitmine ” vara.
- jaotises ' Lubaja ()' funktsiooni, rakendage sama ' automaatne täitmine ' atribuut, kuid määrake sellele nüüd väärtus ' peal ”.
- Pärast seda määrake ' Kontrollija ()' funktsiooni lisades lihtsalt ' automaatne täitmine ' sisendelemendi viite kõrval ja salvestage see muutujasse ' j ”.
- Lõpuks kuvage selle muutuja väärtus ' j ' veebilehel, kasutades nuppu ' sisemine HTML ” vara.
Pärast ülaltoodu koostamist kuvatakse väljund järgmiselt:
Väljund näitab, et sisendmeili automaatse täitmise atribuut on keelatud ja lubatud. Selle väärtus otsitakse ja kuvatakse ka veebilehel.
Järeldus
HTML-i DOM-i sisendmeili automaatse täitmise atribuut loob automaatselt loendi, mis sisaldab väärtusi, mille kasutaja varem meiliväljale sisestas. Nii et kasutaja saab hõlpsasti valida oma varem sisestatud andmete hulgast ja seega suurendab kasutajakogemust. See atribuut määratakse siis, kui väärtuse ' peal ' on sellele määratud ja keelatud, kui väärtus ' väljas ” on läbitud. See ajaveeb on JavaScripti abil selgitanud DOM-i sisendmeili automaatse täitmise atribuuti.