Esim. sähköpostin vahvistus JavaScriptillä (Regex)

Usein meille esitetään tarve vahvistaa, että sähköpostiosoite on syötetty lomakkeemme tiettyyn kenttään. pätevä sähköposti. Tässä artikkelissa opimme vahvistamaan sähköpostit JavaScriptin säännöllisillä lausekkeilla (tunnetaan myös nimellä regex).

Mikä on säännöllinen lauseke (säännöllinen lauseke)?

Säännöllinen lauseke on merkkijono, joka määrittää hakumallin. Tässä tapauksessa haluamme löytää mallin, joka edustaa kelvollista sähköpostiosoitetta.

Säännölliset lausekkeet ovat tehokas ja joustava työkalu tekstimerkkijonojen käsittelyyn ja syötetietojen validointiin.

Sähköpostin vahvistus säännöllisellä lausekkeella

Vahvistaaksemme, että sähköposti on kelvollinen, meidän on varmistettava, että muoto on oikea, eli että se sisältää @-merkin ja verkkotunnuksen. Tätä varten käytämme seuraavaa lauseketta:

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

Koko lomakeesimerkki

Seuraavassa esimerkissä näytämme, kuinka sähköpostiosoite vahvistetaan JavaScriptin ja säännöllisen lausekkeen avulla. Seuraamamme vaiheet ovat:

1. Määrittelemme funktion nimeltä valideMail joka käyttää argumenttina sähköpostin vahvistamista.
2. Luomme muuttujan regex A sisältää säännöllisen lausekkeen sähköpostin vahvistamiseksi.
3. Käytämme menetelmää testata() säännöllisen lausekkeen kohdalta tarkistaaksesi, vastaako annettu sähköpostiosoite mallia.
4. Jos sähköposti on kelvollinen, näytämme varoitusviestin, joka osoittaa sen olevan kelvollinen; muussa tapauksessa näytämme varoitusviestin, joka osoittaa, että se on virheellinen.
5. HTML: ään luomme syöttökentän, jonka tyyppi on "email" ja painikkeen, jota napsautettuna kutsutaan toiminto valideMail syöttökenttään syötetyllä arvolla.

function valideEmail (mail) {
// Säännöllinen lauseke sähköpostin vahvistamiseksi
var regex = /^[w-]+([w-]+)*@[w-]+([w-]+)*.[a-zA-Z]{2,}$/;
// Tarkista, vastaako sähköposti säännöllisen lausekkeen
if (regex.test) määrittämää mallia (posti)) {
alert("Kelvollinen sähköpostiosoite");
} else {
hälytys ("Virheellinen sähköpostiosoite");
}
}

Sähköpostin vahvistus JavaScriptillä ja regexillä

Vahvista

JavaScriptillä validoinnin edut ja haitat

Syötetietojen, kuten sähköpostiosoitteiden, vahvistamisella JavaScriptin avulla asiakaspuolella on etuja ja haittoja:

Edut	Haitat
Välitöntä palautetta käyttäjälle	Ei ole turvallista
Vähemmän kuormitusta palvelimella	Selainten välinen yhteensopivuus
Paranna käyttökokemusta	Päällekkäistyö (asiakas/palvelinpuoli)
Vasteajan lyhentäminen	Ei korvaa vahvistusta palvelinpuolella

Tietojen vahvistaminen JavaScriptillä ei korvaa palvelinpuolen vahvistusta. Se kuitenkin auttaa vähentämään kuormitusta. Tietojen vahvistamiseksi palvelinpuolella suosittelen lukemaan:

• Sähköpostin vahvistus PHP: llä