Pentru crearea de proiecte în timp real, cum ar fi înscrieri la buletine informative, formulare de contact, formulare de plată și autentificarea utilizatorilor, „ e-mail ' Câmpul este obligatoriu. Utilizatorul trebuie să-și introducă adresa de e-mail pentru a continua sau a începe procesul și, de asemenea, să se autentifice în contul său. În acest scop, utilizatorul trebuie să furnizeze o autentificare prin e-mail sau să se înregistreze de fiecare dată, ceea ce o face o experiență proastă pentru utilizator. Această problemă este rezolvată cu ajutorul proprietății de completare automată JavaScript HTML DOM.
Acest blog explică procedura de gestionare a proprietății de completare automată a e-mailului de intrare HTML DOM a JavaScript.
Cum se gestionează proprietatea de completare automată a e-mailului de intrare HTML DOM?
Proprietatea de completare automată a intrării HTML DOM „ e-mail ” element, oferă o listă care conține cele mai recente date care au fost introduse anterior în „ e-mail ' camp. Permite unui utilizator să-și aleagă e-mailul din listă dacă este disponibil automat.
Sintaxă
Sintaxa pentru proprietatea de completare automată a e-mailului de intrare DOM este prezentată mai jos:
emailObj. completare automată = 'pornit|oprit'
Sintaxa de mai sus setează și elimină proprietatea de completare automată peste elementul emailObj.
emailObj. completare automată
Această sintaxă preia valoarea „ completare automată ” proprietate pentru a afla dacă această proprietate este activată sau nu.
Să avem un program JavaScript pentru proprietatea de completare automată
Exemplu: activarea, dezactivarea și preluarea valorii proprietății de completare automată
În acest exemplu, proprietatea de completare automată va fi dezactivată, activată prin setarea acestei proprietăți la „ pe ' și ' oprit ” respectiv. Apoi, valoarea curentă a proprietății de completare automată va fi preluată:
< corp >< centru >
< h1 stil = 'culoare: cadetblue;' > Linux < / h1 >
E-mail: < intrare tip = 'e-mail' id = „e-mail demonstrativ” >
< br >
< br >
< buton onclick = „Dezactivator()” > Dezactivator < / buton >
< buton onclick = „Enabler()” > Activator < / buton >
< h3 id = 'ţintă' > < / h3 >
< buton onclick = „Verificator()” > dama < / buton >
< / centru >
< scenariu >
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;
}
< / scenariu >
< / corp >
Explicația blocului de cod de mai sus este prezentată mai jos:
- În primul rând, „ intrare „elementul este creat cu un tip de atribut „ e-mail ” pentru a accepta și a efectua validarea de bază pentru a vă asigura că datele introduse sunt e-mail.
- În continuare, sunt create trei elemente de buton care numesc „ Disabler()”, „Enabler()” și „Checker() ” funcții.
- Acum, definiți „ Dezactivator ()” selectând funcția „ intrare „ element folosind id-ul său și atribuind valoarea „ oprit „ pentru „ completare automată ” proprietate.
- În ' Activator ()”, aplicați același „ completare automată ” dar acum atribuiți-i o valoare „ pe ”.
- După aceea, definiți „ dama ()” prin adăugarea doar a „ completare automată ” lângă referința elementului de intrare și stocați-l în variabila ” j ”.
- În final, afișați valoarea acestei variabile „ j ” pe pagina web folosind „ innerHTML ” proprietate.
Ieșirea după compilarea celor de mai sus este afișată ca:
Rezultatul arată că proprietatea de completare automată a e-mailului de intrare este dezactivată și activată. Valoarea sa este, de asemenea, preluată și afișată pe pagina web.
Concluzie
Proprietatea de completare automată a e-mailului de intrare HTML DOM creează automat o listă care conține valorile pe care utilizatorul le-a introdus anterior în câmpul de e-mail. Astfel, utilizatorul poate alege cu ușurință dintre datele introduse anterior și, prin urmare, îmbunătățește experiența utilizatorului. Această proprietate este setată atunci când valoarea „ pe ” este alocat acestuia și este dezactivat atunci când valoarea „ oprit ' a trecut. Acest blog a explicat proprietatea de completare automată a e-mailului de intrare DOM prin JavaScript.