T.ex. e-postvalidering med JavaScript (Regex)

Många gånger ställs vi inför behovet av att verifiera att en e-postadress har angetts i ett visst fält i vårt formulär. giltig e-post. I den här artikeln kommer vi att lära oss hur du validerar e-postmeddelanden med reguljära uttryck (även känd som regex) i JavaScript.

Vad är ett reguljärt uttryck (regex)?

Ett reguljärt uttryck är en sekvens av tecken som definierar ett sökmönster. I det här fallet vill vi hitta ett mönster som representerar en giltig e-postadress.

Reguljära uttryck är ett kraftfullt och flexibelt verktyg för att arbeta med textsträngar och validera indata.

E-postvalidering med regex

För att verifiera att ett e-postmeddelande är giltigt måste vi verifiera att formatet är korrekt, det vill säga att det innehåller ett @ och en domän. För detta använder vi följande uttryck:

var regex = /^[w-]+(.[w-]+)*@[w-]+(.[w-]+)*.[a-zA-Z]{2,}$/;

Exempel på fullständigt formulär

I följande exempel visar vi hur man validerar en e-postadress med JavaScript och ett reguljärt uttryck. Stegen vi följer är:

1. Vi definierar en funktion som kallas valideraMail det tar som argument e-postmeddelandet att validera.
2. Vi skapar en variabel regex A som innehåller det reguljära uttrycket för att validera e-postmeddelandet.
3. Vi använder metoden testa() av det reguljära uttrycket för att kontrollera om e-postmeddelandet stämmer överens med mönstret.
4. Om e-postmeddelandet är giltigt visar vi ett varningsmeddelande som indikerar att det är giltigt; annars visar vi ett varningsmeddelande som indikerar att det är ogiltigt.
5. I HTML-koden skapar vi ett inmatningsfält av typen "e-post" och en knapp som när du klickar på den anropar funktionen valideraMail med värdet angett i inmatningsfältet.

funktion validateEmail (mail) {
// Reguljärt uttryck för att validera e-post
var regex = /^[w-]+(.[w-]+)*@[w-]+(.[w-]+)*.[a-zA-Z]{2,}$/;
// Kontrollera om posten matchar mönstret som definieras av det reguljära uttrycket
if (regex.test (mail)) {
alert("Giltig e-post");
} else {
alert ("Ogiltig e-post");
}
}

E-postvalidering med JavaScript och regex

Bekräfta

Fördelar och nackdelar med att validera med JavaScript

Validering av indata, såsom e-postadresser, med JavaScript på klientsidan har fördelar och nackdelar:

Fördelar	Nackdelar
Omedelbar feedback till användaren	Är inte säker
Mindre belastning på servern	Korswebbläsarkompatibilitet
Förbättra användarupplevelsen	Duplicering av ansträngning (klient-/serversidan)
Reduktion av svarstid	Ersätter inte validering på serversidan

Validering av data med JavaScript är inte en ersättning för validering på serversidan. Det hjälper dock till att minska belastningen. För att validera data på serversidan rekommenderar jag att du läser:

• Mailvalidering med PHP