Come convalidare l'indirizzo e -mail in JavaScript

Il processo di verifica dei valori inseriti dagli utenti è noto come convalida. Migliora l'esperienza dell'utente ed è significativo per le applicazioni Web. La convalida viene utilizzata in JavaScript per verificare l'identità di un utente controllando l'e -mail, la password, il numero di cellulare dell'utente e una varietà di altre informazioni. Questa tecnica viene utilizzata maggiormente durante la creazione di forme per i siti Web.

In questo post, parleremo di alcuni metodi comuni per convalidare gli indirizzi e -mail in JavaScript.

Come convalidare l'indirizzo e -mail in JavaScript?

Quando si verificano un modulo HTML, la convalida dell'e -mail è un passaggio fondamentale. In JavaScript, puoi convalidare l'indirizzo e -mail:

1. Usando regex
2. Senza regex

Esaminiamo come questi approcci convalideranno l'e -mail.

Metodo 1: convalida l'indirizzo e -mail utilizzando Regex

Per convalidare un'e -mail, è possibile utilizzare un modello regex/espressione regolare con JavaScript "incontro()" metodo. Il valore dell'e -mail specificata in un campo di input viene confrontato con un'espressione regolare o un modello di regex utilizzando il metodo Match ().

Sintassi
Seguire la sintassi seguente per la convalida di un'e -mail utilizzando il metodo Match ():

testo di input.valore.Match (regexPattern);

Qui, il "regexpattern"È l'espressione regolare che corrisponderà al valore del campo di testo.

Ora, controlla il seguente esempio.

Esempio
In questo esempio, creeremo un modulo HTML che contiene un valore di input e un pulsante che controllerà se l'e-mail immessa è valida o meno chiamando la funzione JavaScript definita dall'utente denominata "MailValidation ()":

Invia

Nel file JavaScript, definiremo il "MailValidation ()"Metodo che prende il valore del campo di input come parametro. Successivamente, definisci un modello di regex per e-mail che segue alfabeti A-Za-Z, caratteri, cifre 0-9, con @ e ((.). Quindi, chiama il metodo Match () con il valore di testo di input passando il modello regex. Se il valore del testo di input corrisponde al regex, un avviso mostrerà con il messaggio "Indirizzo e-mail valido!"; Altrimenti, l'avviso mostra un messaggio specificato:

function MailValidation (InputText)

regexpattern = /^[a-za-z0-9.!#$%& '*+/=?^_ '| ~-]+@[a-za-z0-9-]+(?: \.[A-za-z0-9-]+)*$/;
inputTextVal = documento.getElementById ("txt");
if (inputTextVal.valore.Match (regexPattern))

Avviso ("Indirizzo e -mail valido!");
restituire vero;

altro

Avviso ("Hai inserito un indirizzo email non valido!");
restituire false;

Si può vedere che la nostra metodologia definita funziona perfettamente per verificare l'indirizzo e -mail:

Vediamo un altro metodo per convalidare la posta elettronica senza usare Regex.

Metodo 2: convalidare l'indirizzo e -mail senza utilizzare Regex

Per la convalida e -mail senza regex, è possibile utilizzare "Include ()" metodo. Dà un valore booleano come output. Accetta i personaggi come argomento e ritorna "VERO"Se esistono nell'input, altrimenti emette"falso".

Sintassi
Segui la sintassi sotto fornita per utilizzare il metodo Include ():

corda.Include (caratteri);

Qui, "caratteri"Sono i (@) segno e (.) che verrà controllato nell'e -mail inserita.

Esempio
In questo esempio, apporteremo le modifiche alla funzione JavaScript sopra creata denominata "MailValidation ()". Qui useremo il metodo Include () in funzione per verificare il valore di input se contiene (@) segno e (.) o no:

function MailValidation (InputText)

inputTextVal = documento.getElementById ("txt");
if (inputTextVal.valore.Include ("@", "."))

Avviso ("Indirizzo e -mail valido!");
restituire vero;

altro

Avviso ("Hai inserito un indirizzo email non valido!");
restituire false;

Produzione

Abbiamo compilato i metodi più semplici per convalidare gli indirizzi e -mail utilizzando JavaScript.

Conclusione

Per convalidare un indirizzo email, è possibile utilizzare "incontro()"Metodo per convalidare con regex o il"Include ()"Metodo per convalidare l'e -mail senza utilizzare Regex. Il metodo Match () corrisponde all'indirizzo e -mail inserito con il particolare regex mentre il metodo Include () controlla il "@" e il "."Nell'e -mail se entrambi sono inclusi nell'e -mail inserita o meno. Questo post ha discusso i metodi per la convalida degli indirizzi e -mail in JavaScript con esempi dettagliati.