Come eseguire la convalida dell'e-mail in JavaScript? [Con esempi]
Pubblicato: 2021-02-23JavaScript è un linguaggio di programmazione progettato per creare applicazioni. È molto più veloce di altre lingue perché è così leggero e facile da usare. Viene utilizzato per creare applicazioni ben progettate.
La convalida dell'e-mail in JavaScript è importante per l'esperienza dell'utente nella creazione di applicazioni Web. La convalida aiuta a trasmettere informazioni valide a un server dal client dell'applicazione Web.
Sommario
Cos'è la convalida?
La convalida si riferisce al processo di esame dei valori immessi dall'utente. Svolge un ruolo cruciale nella creazione di applicazioni e migliora l'esperienza dell'utente. Molti campi, come numeri di cellulare, e-mail, date e password, vengono convalidati tramite questo processo.
JavaScript rende il processo di convalida più veloce grazie alla sua elaborazione dei dati più rapida rispetto ad altre convalide lato server. Ora diamo un'occhiata all'implementazione della convalida dell'e-mail in JavaScript .
Convalida e-mail in JavaScript
La convalida dell'e-mail è una delle parti vitali dell'autenticazione di un modulo HTML. L'email è un sottoinsieme o una stringa di caratteri ASCII, divisa in due parti tramite il simbolo @. La sua prima parte è costituita da informazioni private e la seconda contiene il nome di dominio in cui viene registrata un'e-mail.
Ecco i caratteri ASCII della prima parte:
- Caratteri speciali come # * + & '! % @ ? { ^ } ”
- Caratteri numerici (da 0 a 9)
- Punto, punto, ecc., a condizione che non possa essere l'ultima o la prima lettera dell'e-mail e non possa essere ripetuta dopo l'altra.
- Alfabeti maiuscoli (dalla A alla Z) e minuscoli (dalla a alla z).
La seconda parte comprende quanto segue:
- Punti
- Cifre
- trattini
- Lettere
L'uso di espressioni regolari è uno dei modi migliori per la convalida delle e-mail in JavaScript . Utilizza espressioni regolari per definire il modello del personaggio.
Alcuni degli esempi di ID e-mail valido:
- [email protected]
- Proprietario del [email protected]
- [email protected]
Alcuni altri esempi di ID e-mail non valido
- [email protected] (non sono ammessi punti uno sull'altro)
- Inownzsite()&@abcd.com (nell'espressione regolare sono consentiti solo caratteri, trattino, trattino basso e cifre.)
- Ourwebsiteismne.azbyz.com (qui il simbolo @ non è presente)
- [email protected] (qui il dominio di primo livello non può iniziare con un punto)
- @youmenandwe.we.net (qui non può iniziare con il simbolo @)
- [email protected] (“.b” non è un dominio di primo livello valido)email.js
Il file è costituito da un codice JavaScript richiesto per la convalida dell'e-mail. Qui le espressioni regolari vengono utilizzate per convalidare un'e-mail sul lato client di un'applicazione.
Punti di controllo per una convalida efficiente delle e-mail nel codice JavaScript:
- Descrivi un'espressione regolare per convalidare un indirizzo email
- Se un valore di input corrisponde alle espressioni regolari
- Se corrisponde, invia l'avviso dicendo "l'indirizzo e-mail è valido".
- Se non corrisponde, invia l'avviso dicendo "l'indirizzo e-mail non è valido".
Correlati: convalida della password in Javascript
Codice di convalida dell'e-mail in JavaScript
Di seguito è riportato il codice di convalida dell'e-mail in JavaScript. Questo codice può convalidare se l'e-mail creata o inserita dall'utente è valida o meno. Salva il file come nomefile.js.
// Frammento di codice
funzione EmailConvalida(inseritaEmail)
{
var formato_posta = /^w+([.-]?w+)*@w+([.-]?w+)*(.w{2,3})+$/;
if(enteredEmail.value.match(enteredEmail))
{
alert("Sì! un'email valida!");
document.form1.text1.focus();
restituisce vero;
}
Altro
{
alert("Scusa! un'email non valida!");
document.form1.text1.focus();
restituire falso;
}
}
La funzione JavaScript viene utilizzata nel modulo HTML come di seguito. Salva il file come nomefile.html:
<!DOCTYPE html>
<html lang="it">
<testa>
<meta charset="utf-8″>
<title>convalida e-mail in JavaScript</title>
<link rel='stylesheet' href='form-style.css' type='text/css' />
</testa>
<body onload='document.form1.text1.focus()'>
<classe div="posta">
<h2>Inserisci l'e-mail per la convalida</h2>
<nome modulo=”form1″ azione=”#”>
<ul>
<li><input type='text' name='text1'/></li>
<li> </li>
<li class=”Convalida”><input type=”submit” name=”Convalida” value=”Convalida” onclick=”ValidateEmail(document.form1.text1)”/></li>
<li> </li>
</ul>
</modulo>
</div>
<script src="nomefile.js"></script>
</corpo>
</html>
Il codice seguente può aggiungere stile al modulo utilizzando CSS. Salva il file come nomefile.css.
li {tipo-stile-elenco: nessuno;
dimensione del carattere: 16pt;
}
.posta {
margine: automatico;
imbottitura superiore: 20px;
imbottitura-fondo: 20px;
larghezza: 850px;
sfondo: rgb(150, 195, 208);
bordo: 1px soild rgb(1, 20, 24);
}
.mail h2 {
margine sinistro: 36px;
}
ingresso {
dimensione del carattere: 28pt;
}
input: focus, textarea: focus{
colore di sfondo: bianco;
}
inserisci invia {
dimensione del carattere: 18pt;
}
Ora puoi eseguire il codice HTML e ottenere la convalida dell'e-mail in JavaScript .
Leggi: Progetti Javascript in GitHub
Impara i corsi di software online dalle migliori università del mondo. Guadagna programmi Executive PG, programmi di certificazione avanzati o programmi di master per accelerare la tua carriera.
Conclusione
La convalida dell'e-mail è molto importante per evitare di creare indirizzi e-mail non validi. In questo articolo viene spiegato, con il codice, di convalidare se un ID e-mail è valido o meno e lasciare che il sistema controlli e comunichi all'utente se l'ID e-mail inserito non è valido.
Se sei interessato a saperne di più sullo sviluppo full-stack, dai un'occhiata al programma Executive PG di upGrad & IIIT-B in Full-stack Software Development, progettato per i professionisti che lavorano e offre oltre 500 ore di formazione rigorosa, oltre 9 progetti e incarichi , status di Alumni IIIT-B, progetti pratici pratici e assistenza sul lavoro con le migliori aziende.
