Jak wykonać weryfikację wiadomości e-mail w JavaScript? [Z przykładami]
Opublikowany: 2021-02-23JavaScript to język programowania przeznaczony do tworzenia aplikacji. Jest znacznie szybszy niż inne języki, ponieważ jest tak lekki i łatwy w użyciu. Służy do tworzenia dobrze zaprojektowanych aplikacji.
Walidacja wiadomości e-mail w JavaScript jest ważna dla doświadczenia użytkownika podczas tworzenia aplikacji internetowych. Walidacja pomaga w przekazywaniu poprawnych informacji do serwera od klienta aplikacji internetowej.
Spis treści
Co to jest walidacja?
Walidacja odnosi się do procesu sprawdzania wartości wprowadzanych przez użytkownika. Odgrywa kluczową rolę w tworzeniu aplikacji i poprawia wrażenia użytkownika. Wiele pól, takich jak numery telefonów komórkowych, adresy e-mail, daty i hasła, jest weryfikowanych w tym procesie.
JavaScript przyspiesza proces walidacji ze względu na szybsze przetwarzanie danych niż inne metody walidacji po stronie serwera. Przyjrzyjmy się teraz implementacji walidacji wiadomości e-mail w JavaScript .
Walidacja e-mail w JavaScript
Walidacja wiadomości e-mail jest jedną z najważniejszych części uwierzytelniania formularza HTML. Email to podzbiór lub ciąg znaków ASCII, podzielony na dwie części za pomocą symbolu @. Jej pierwsza część to prywatne informacje, a druga zawiera nazwę domeny, w której rejestrowany jest e-mail.
Oto znaki ASCII z pierwszej części:
- Znaki specjalne, takie jak # * + & ' ! % @ ? { ^ } ”
- Znaki numeryczne (od 0 do 9)
- Kropka, kropka itp. pod warunkiem, że nie może to być ostatnia lub pierwsza litera e-maila i nie może być powtarzana po kolei.
- Wielkie litery (od A do Z) i małe litery (a do z)
Druga część zawiera:
- Kropki
- Cyfry
- Myślniki
- Listy
Używanie wyrażeń regularnych jest jednym z najlepszych sposobów sprawdzania poprawności wiadomości e-mail w JavaScript . Wykorzystuje wyrażenia regularne do definiowania wzorca postaci.
Niektóre przykłady prawidłowego identyfikatora e-mail:
- [email protected]
- Właściciel [email protected]
- [email protected]
Kilka innych przykładów nieprawidłowego identyfikatora e-mail
- [email protected] (kropki nie są dozwolone)
- Inownzsite()&@abcd.com (w wyrażeniu regularnym dozwolone są tylko znaki, myślnik, podkreślenie i cyfry).
- Ourwebsiteismne.azbyz.com (tutaj symbolu @ nie ma)
- [email protected] (Tutaj domena najwyższego poziomu nie może zaczynać się od kropki)
- @youmenandwe.we.net (tutaj nie może zaczynać się od symbolu @)
- [email protected] („.b” nie jest prawidłową domeną najwyższego poziomu)email.js
Plik zawiera kod JavaScript wymagany do weryfikacji wiadomości e-mail. W tym przypadku wyrażenia regularne służą do sprawdzania poprawności wiadomości e-mail po stronie klienta aplikacji.
Punkty kontrolne dla wydajnej walidacji wiadomości e-mail w kodzie JavaScript:
- Opisz wyrażenie regularne do sprawdzania poprawności adresu e-mail
- Jeśli wartość wejściowa pasuje do wyrażeń regularnych
- Jeśli się zgadza, wysyła alert o treści „adres e-mail jest prawidłowy”.
- Jeśli się nie zgadza, wyślij ostrzeżenie o treści „adres e-mail jest nieprawidłowy”.
Powiązane: Weryfikacja hasła w JavaScript
E-mailowy kod weryfikacyjny w JavaScript
Poniżej podano kod weryfikacyjny poczty e-mail w JavaScript. Ten kod może sprawdzić, czy adres e-mail utworzony lub wprowadzony przez użytkownika jest ważny, czy nie. Zapisz plik jako nazwapliku.js.
/ / Fragment kodu
funkcja EmailValidation (wprowadzonyEmail)
{
var format_maila = /^w+([.-]?w+)*@w+([.-]?w+)*(.w{2,3})+$/;
if(wprowadzonyEmail.value.match(wpisanyEmail))
{
alert („Tak! ważny e-mail!”);
dokument.form1.tekst1.focus();
zwróć prawdę;
}
W przeciwnym razie
{
alert(„Przepraszamy! nieprawidłowy e-mail!”);
dokument.form1.tekst1.focus();
zwróć fałsz;
}
}
Funkcja JavaScript jest używana w formularzu HTML jak poniżej. Zapisz plik jako nazwapliku.html:
<!DOCTYPE html>
<html lang="pl">
<głowa>
<meta charset=”utf-8″>
<title>Weryfikacja poczty e-mail w JavaScript</title>
<link rel='stylesheet' href='form-style.css' type='text/css' />
</head>
<body onload='document.form1.text1.focus()'>
<div class="mail">
<h2>Wprowadź adres e-mail do weryfikacji</h2>
<nazwa formularza=”form1″ akcja=”#”>
<ul>
<li><input type='text' name='text1'/></li>
<li> </li>
<li class=”Validate”><input type=”submit” name=”Validate” value=”Validate” onclick=”ValidateEmail(document.form1.text1)”/></li>
<li> </li>
</ul>
</form>
</div>
<script src=”nazwapliku.js”></script>
</body>
</html>
Poniższy kod może dodać styl do formularza za pomocą CSS. Zapisz plik jako nazwapliku.css.
li {list-style-type: brak;
rozmiar czcionki: 16 pkt;
}
.Poczta {
margines: auto;
wyściółka: 20px;
dopełnienie-dolne: 20px;
szerokość: 850px;
tło : rgb (150, 195, 208);
obramowanie: 1px zabrudzony rgb (1, 20, 24);
}
.poczta h2 {
margines lewy: 36px;
}
Wejście {
rozmiar czcionki: 28 pkt;
}
dane wejściowe:ostrość, obszar tekstu:ostrość{
kolor tła: biały;
}
dane wejściowe prześlij {
rozmiar czcionki: 18 pkt;
}
Teraz możesz wykonać kod HTML i wykonać walidację wiadomości e-mail w JavaScript .
Przeczytaj: Projekty JavaScript w GitHub
Ucz się kursów oprogramowania online z najlepszych światowych uniwersytetów. Zdobywaj programy Executive PG, Advanced Certificate Programs lub Masters Programs, aby przyspieszyć swoją karierę.
Wniosek
Sprawdzanie poprawności adresu e-mail jest bardzo ważne, aby uniknąć tworzenia nieprawidłowych adresów e-mail. W tym artykule wyjaśniono, za pomocą kodu, aby sprawdzić, czy identyfikator e-mail jest ważny, czy nie, i pozwolić systemowi sprawdzić i powiadomić użytkownika, jeśli wprowadzony identyfikator e-mail jest nieprawidłowy.
Jeśli chcesz dowiedzieć się więcej o rozwoju pełnego stosu, zapoznaj się z programem Executive PG UpGrad i IIIT-B w zakresie programowania pełnego stosu, który jest przeznaczony dla pracujących profesjonalistów i oferuje ponad 500 godzin rygorystycznych szkoleń, ponad 9 projektów i zadań , status absolwentów IIIT-B, praktyczne, praktyczne projekty zwieńczenia i pomoc w pracy z najlepszymi firmami.
