B. E-Mail-Validierung mit JavaScript (Regex)

Oft müssen wir bestätigen, dass eine E-Mail-Adresse in ein bestimmtes Feld unseres Formulars eingegeben wurde. gültige E-Mail. In diesem Artikel erfahren Sie, wie Sie E-Mails mit regulären Ausdrücken (auch bekannt als Regex) in JavaScript validieren.

Was ist ein regulärer Ausdruck (Regex)?

Ein regulärer Ausdruck ist eine Zeichenfolge, die ein Suchmuster definiert. In diesem Fall möchten wir ein Muster finden, das eine gültige E-Mail-Adresse darstellt.

Reguläre Ausdrücke sind ein leistungsstarkes und flexibles Werkzeug zum Arbeiten mit Textzeichenfolgen und zum Validieren von Eingabedaten.

E-Mail-Validierung mit Regex

Um zu bestätigen, dass eine E-Mail gültig ist, müssen wir überprüfen, ob das Format korrekt ist, das heißt, dass es ein @ und eine Domäne enthält. Dazu verwenden wir folgenden Ausdruck:

Var regulärer Ausdruck = /^[w-]+(.[w-]+)*@[w-]+(.[w-]+)*.[a-zA-Z]{2,}$/;

Beispiel für ein vollständiges Formular

Im folgenden Beispiel zeigen wir, wie Sie eine E-Mail-Adresse mit JavaScript und einem regulären Ausdruck validieren. Die Schritte, die wir befolgen, sind:

1. Wir definieren eine Funktion namens validateMail das nimmt als Argument die zu validierende E-Mail.
2. Wir erstellen eine Variable regulärer Ausdruck A mit dem regulären Ausdruck zur Validierung der E-Mail.
3. Wir verwenden die Methode prüfen() des regulären Ausdrucks, um zu prüfen, ob die eingegebene E-Mail dem Muster entspricht.
4. Wenn die E-Mail gültig ist, zeigen wir eine Warnmeldung an, die darauf hinweist, dass sie gültig ist; andernfalls zeigen wir eine Warnmeldung an, die angibt, dass sie ungültig ist.
5. Im HTML erstellen wir ein Eingabefeld vom Typ „E-Mail“ und einen Button, der beim Anklicken die Funktion aufruft validateMail mit dem im Eingabefeld eingegebenen Wert.

function validateEmail (mail) {
// Regulärer Ausdruck zum Validieren von E-Mails
var regex = /^[w-]+(.[w-]+)*@[w-]+(.[w-]+)*.[a-zA-Z]{2,}$/;
// Überprüfen Sie, ob die E-Mail mit dem Muster übereinstimmt, das durch den regulären Ausdruck definiert ist
if (regex.test (Mail)) {
alert("Valid email");
} else {
alert ("Ungültige E-Mail");
}
}

E-Mail-Validierung mit JavaScript und Regex

Bestätigen

Vor- und Nachteile der Validierung mit JavaScript

Die Validierung von Eingabedaten wie E-Mail-Adressen mit JavaScript auf Client-Seite hat Vor- und Nachteile:

Vorteile	Nachteile
Sofortiges Feedback für den Benutzer	Ist nicht sicher
Weniger Last auf dem Server	Cross-Browser-Kompatibilität
Verbessern Sie die Benutzererfahrung	Doppelaufwand (client-/serverseitig)
Reduzierung der Reaktionszeit	Ersetzt nicht die Validierung auf der Serverseite

Die Validierung von Daten mit JavaScript ist kein Ersatz für die serverseitige Validierung. Es hilft jedoch, die Belastung zu reduzieren. Um Daten auf der Serverseite zu validieren, empfehle ich Ihnen Folgendes zu lesen:

• E-Mail-Validierung mit PHP