Na vytváranie projektov v reálnom čase, ako sú prihlasovanie na odber noviniek, kontaktné formuláre, pokladničné formuláre a prihlasovacie údaje používateľov, „ email ' pole je povinné. Používateľ musí zadať svoj e-mail, aby mohol pokračovať alebo spustiť proces a tiež sa prihlásiť do svojho účtu. Na tento účel musí používateľ zakaždým poskytnúť e-mailové prihlásenie alebo sa zaregistrovať, čo z neho robí zlú používateľskú skúsenosť. Tento problém je vyriešený pomocou vlastnosti automatického dopĺňania JavaScript HTML DOM.
Tento blog vysvetľuje postup spracovania vlastnosti automatického dopĺňania e-mailu HTML DOM v jazyku JavaScript.
Ako zaobchádzať s vlastnosťou automatického dopĺňania e-mailu so vstupom HTML DOM?
Vlastnosť automatického dopĺňania vstupu HTML DOM “ email “, poskytuje zoznam obsahujúci najnovšie údaje, ktoré boli predtým vložené do „ email ' lúka. Umožňuje používateľovi vybrať svoj e-mail zo zoznamu, ak je k dispozícii automaticky.
Syntax
Syntax pre vlastnosť automatického dopĺňania e-mailu pre vstup DOM je uvedená nižšie:
emailObj. automatické dopĺňanie = 'zapnuté|vypnuté'
Vyššie uvedená syntax nastavuje a odstraňuje vlastnosť automatického dopĺňania nad prvkom emailObj.
emailObj. automatické dopĺňanie
Táto syntax načítava hodnotu „ automatické dopĺňanie ” a zistite, či je táto vlastnosť povolená alebo nie.
Majme program JavaScript pre vlastnosť automatického dopĺňania
Príklad: Povolenie, zakázanie a načítanie hodnoty vlastnosti automatického dopĺňania
V tomto príklade bude vlastnosť automatického dopĺňania deaktivovaná, povolená nastavením tejto vlastnosti na „ na “ a „ vypnuté “. Potom sa získa aktuálna hodnota vlastnosti automatického dopĺňania:
< telo >< stred >
< h1 štýl = 'color: kadetblue;' > Linux < / h1 >
E-mail: < vstup typu = 'e-mail' id = 'demoEmail' >
< br >
< br >
< tlačidlo po kliknutí = 'Zakázať()' > Deaktivátor < / tlačidlo >
< tlačidlo po kliknutí = 'Enabler()' > Aktivátor < / tlačidlo >
< h3 id = 'cieľ' > < / h3 >
< tlačidlo po kliknutí = 'Kontrola()' > Dáma < / tlačidlo >
< / stred >
< skript >
function Disabler() {
document.getElementById('demoEmail').autocomplete = 'off';
}
function Enabler() {
document.getElementById('demoEmail').autocomplete = 'on';
}
function Checker() {
var j = document.getElementById('demoEmail').autocomplete;
document.getElementById('target').innerHTML = j;
}
< / skript >
< / telo >
Vysvetlenie vyššie uvedeného bloku kódu je uvedené nižšie:
- Po prvé, „ vstup ” prvok je vytvorený s typom atribútu “ email ” na prijatie a vykonanie základného overenia, aby ste sa uistili, že zadané údaje sú e-mailom.
- Ďalej sa vytvoria tri prvky tlačidiel, ktoré volajú „ Disabler()“, „Enabler()“ a „Checker() funkcie.
- Teraz definujte „ Deaktivátor ()“ výberom funkcie „ vstup prvok pomocou svojho ID a priradením hodnoty „ vypnuté “ za svoje “ automatické dopĺňanie ' nehnuteľnosť.
- V ' Aktivátor ()“, použite rovnakú funkciu „ automatické dopĺňanie “, ale teraz jej priraďte hodnotu “ na “.
- Potom definujte „ Dáma ()“ pridaním iba „ automatické dopĺňanie “ vedľa odkazu vstupného prvku a uložte ho do premennej “ j “.
- Nakoniec zobrazte hodnotu tejto premennej “ j “ cez webovú stránku pomocou „ innerHTML ' nehnuteľnosť.
Výstup po kompilácii vyššie uvedeného sa zobrazí ako:
Výstup ukazuje, že vlastnosť automatického dopĺňania vstupného e-mailu je zakázaná a povolená. Jeho hodnota sa tiež načíta a zobrazí na webovej stránke.
Záver
Vlastnosť automatického dopĺňania e-mailu vstupu HTML DOM automaticky vytvorí zoznam, ktorý obsahuje hodnoty, ktoré používateľ predtým zadal do poľa e-mailu. Používateľ si tak môže jednoducho vybrať zo svojich predtým zadaných údajov, a tým zlepšuje používateľskú skúsenosť. Táto vlastnosť je nastavená, keď hodnota „ na ” je k nej priradený a deaktivovaný, keď je hodnota “ vypnuté “ je odovzdaný. Tento blog vysvetľuje vlastnosť automatického dopĺňania e-mailu pre vstup DOM pomocou JavaScriptu.