Pl. e-mail ellenőrzés JavaScripttel (Regex)

Sokszor szembesülünk azzal, hogy ellenőrizni kell, hogy az űrlapunk egy bizonyos mezőjében be van-e írva egy e-mail cím. érvényes email. Ebből a cikkből megtudjuk, hogyan ellenőrizheti az e-maileket reguláris kifejezések (más néven regex) használatával a JavaScriptben.

Mi az a reguláris kifejezés (regex)?

A reguláris kifejezés egy keresési mintát meghatározó karaktersorozat. Ebben az esetben egy érvényes e-mail címet képviselő mintát akarunk találni.

A reguláris kifejezések hatékony és rugalmas eszközt jelentenek a szöveges karakterláncokkal való munkához és a bemeneti adatok ellenőrzéséhez.

E-mail érvényesítés reguláris kifejezéssel

Az e-mail érvényességének ellenőrzéséhez ellenőriznünk kell, hogy a formátum helyes-e, vagyis hogy tartalmaz-e egy @ jelet és egy domaint. Ehhez a következő kifejezést használjuk:

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

Teljes űrlappélda

A következő példában bemutatjuk, hogyan kell érvényesíteni egy e-mail címet JavaScript és reguláris kifejezés használatával. Az általunk követett lépések a következők:

1. ún. függvényt határozunk meg validateMail amely argumentumként az e-mailt veszi az érvényesítéshez.
2. Változót hozunk létre regex A, amely az e-mail ellenőrzéséhez szükséges reguláris kifejezést tartalmazza.
3. A módszert használjuk teszt() reguláris kifejezést, hogy ellenőrizze, hogy a megadott e-mail-cím megegyezik-e a mintával.
4. Ha az e-mail érvényes, akkor egy figyelmeztető üzenetet jelenítünk meg, amely jelzi, hogy érvényes; ellenkező esetben egy figyelmeztető üzenetet jelenítünk meg, amely jelzi, hogy az érvénytelen.
5. A HTML-ben létrehozunk egy "e-mail" típusú beviteli mezőt és egy gombot, amelyre kattintva meghívja a függvényt validateMail a beviteli mezőbe beírt értékkel.

function validateEmail (mail) {
// Reguláris kifejezés az e-mail ellenőrzéséhez
var regex = /^[w-]+([w-]+)*@[w-]+([w-]+)*.[a-zA-Z]{2,}$/;
// Ellenőrizze, hogy a levél egyezik-e a reguláris kifejezés által meghatározott mintával
if (regex.test (mail)) {
alert("Érvényes e-mail");
} else {
alert ("Érvénytelen e-mail");
}
}

E-mail ellenőrzés JavaScript és regex segítségével

Érvényesít

A JavaScripttel történő érvényesítés előnyei és hátrányai

A bemeneti adatok, például az e-mail címek ellenőrzése a JavaScript használatával a kliens oldalon megvannak az előnyei és hátrányai:

Előnyök	Hátrányok
Azonnali visszajelzés a felhasználónak	Nem biztonságos
Kevesebb terhelés a szerveren	Böngészők közötti kompatibilitás
A felhasználói élmény javítása	Az erőfeszítések megkettőzése (kliens/szerver oldal)
A válaszidő csökkentése	Nem helyettesíti az érvényesítést a szerver oldalon

Az adatok JavaScript használatával történő ellenőrzése nem helyettesíti a szerveroldali ellenőrzést. Ez azonban segít a terhelés csökkentésében. A szerveroldali adatok ellenőrzéséhez javaslom, hogy olvassa el:

• Levélellenőrzés PHP-vel