Pro vytváření projektů v reálném čase, jako jsou přihlášení k odběru newsletteru, kontaktní formuláře, pokladní formuláře a přihlášení uživatelů, „ e-mailem ' políčko je vyžadováno. Uživatel musí zadat svůj e-mail, aby mohl pokračovat nebo zahájit proces a také se přihlásit ke svému účtu. Za tímto účelem musí uživatel pokaždé poskytnout přihlašovací e-mail nebo se zaregistrovat, což z něj činí špatnou uživatelskou zkušenost. Tento problém je vyřešen pomocí vlastnosti automatického doplňování JavaScript HTML DOM.
Tento blog vysvětluje postup zpracování vlastnosti automatického doplňování vstupního e-mailu HTML DOM JavaScriptu.
Jak zacházet s vlastností automatického doplňování e-mailu pro vstupní e-mail HTML DOM?
Vlastnost automatického doplňování vstupu HTML DOM “ e-mailem ', poskytuje seznam obsahující nejnovější data, která byla dříve vložena do ' e-mailem pole. Umožňuje uživateli vybrat svůj e-mail ze seznamu, pokud je automaticky dostupný.
Syntax
Syntaxe pro vlastnost automatického doplňování vstupního e-mailu DOM je uvedena níže:
emailObj. automatické doplňování = 'on|off'
Výše uvedená syntaxe nastavuje a odstraňuje vlastnost autocomplete nad elementem emailObj.
emailObj. automatické doplňování
Tato syntaxe získá hodnotu „ automatické doplňování ” a zjistěte, zda je tato vlastnost povolena nebo ne.
Mějme program JavaScript pro vlastnost automatického doplňování
Příklad: Povolení, zakázání a načtení hodnoty vlastnosti automatického doplňování
V tomto příkladu bude vlastnost automatického doplňování zakázána a povolena nastavením této vlastnosti na „ na ' a ' vypnuto “. Poté bude načtena aktuální hodnota vlastnosti automatického doplňování:
< tělo >< centrum >
< h1 styl = 'color: kadetblue;' > Linux < / h1 >
E-mailem: < vstup typ = 'e-mailem' id = 'demoEmail' >
< br >
< br >
< knoflík při kliknutí = 'Zakázat()' > Deaktivátor < / knoflík >
< knoflík při kliknutí = 'Enabler()' > Aktivátor < / knoflík >
< h3 id = 'cílová' > < / h3 >
< knoflík při kliknutí = 'Kontrola()' > Dáma < / knoflík >
< / centrum >
< 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 >
< / tělo >
Vysvětlení výše uvedeného bloku kódu je uvedeno níže:
- Za prvé, „ vstup 'prvek je vytvořen s typem atributu' e-mailem ” přijmout a provést základní ověření, abyste se ujistili, že zadaná data jsou e-mailem.
- Dále se vytvoří tři prvky tlačítka, které volají „ Disabler()“, „Enabler()“ a „Checker() “ funkce.
- Nyní definujte „ Deaktivátor ()“ výběrem funkce „ vstup ” element pomocí svého id a přiřazením hodnoty “ vypnuto “ za jeho “ automatické doplňování ' vlastnictví.
- V ' Aktivátor ()“, použijte stejnou funkci „ automatické doplňování vlastnost “, ale nyní jí přiřaďte hodnotu “ na “.
- Poté definujte „ Dáma ()“ přidáním pouze „ automatické doplňování “ vedle odkazu na vstupní prvek a uložte jej do proměnné “ j “.
- Nakonec zobrazte hodnotu této proměnné “ j “ přes webovou stránku pomocí „ vnitřní HTML ' vlastnictví.
Výstup po kompilaci výše uvedeného je zobrazen jako:
Výstup ukazuje, že vlastnost automatického doplňování vstupních e-mailů je zakázána a povolena. Jeho hodnota je také načtena a zobrazena na webové stránce.
Závěr
Vlastnost automatického doplňování e-mailu vstupu HTML DOM automaticky vytvoří seznam obsahující hodnoty, které uživatel dříve zadal do pole e-mailu. Uživatel si tak může snadno vybrat ze svých dříve zadaných údajů, a zlepšuje tak uživatelskou zkušenost. Tato vlastnost je nastavena, když hodnota „ na ” je mu přiřazeno a deaktivováno, když je hodnota “ vypnuto “ je předán. Tento blog vysvětlil vlastnost automatického doplňování e-mailu DOM pomocí JavaScriptu.