Blokada wysyłki formularza i walidacja e-maila
Treść zadania
W dokumencie przygotowano formularz:<form id="formularzRejestru">
<input type="text" id="poleEmail" value="niepoprawny-email">
<button type="submit" id="btnSubmit">Wyślij</button>
</form>
<p id="bladEmail"></p>
Napisz obsługę: zarejestruj zdarzenie submit na formularzu, wywołaj e.preventDefault(), aby zapobiec przeładowaniu strony. Jeśli wpisany e-mail nie zawiera znaku '@' (!email.includes('@')), wpisz do akapitu 'Brak znaku @ w adresie'; w przeciwnym razie wpisz 'Adres przyjęty'.
Co będzie oceniane
- Zdarzenie submit na #formularzRejestru z e.preventDefault().
- Weryfikacja obecności znaku '@' za pomocą includes().
- Wpisanie komunikatu o błędzie do #bladEmail.
- Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.
Testy automatyczne (2)
- Brak znaku @ blokuje akceptację i zgłasza błąd — tekst #bladEmail = Brak znaku @ w adresie
- Prawidłowy adres ze znakiem @ zostaje przyjęty — tekst #bladEmail = Adres przyjęty
Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.
// Przechwyć submit formularza #formularzRejestru i zweryfikuj obecność znaku @
Wskazówki
Wskazówka 1
Metoda preventDefault na obiekcie zdarzenia zatrzymuje domyślną akcję przeglądarki, taką jak wysłanie formularza.
Wskazówka 2
Podepnij nasłuchiwanie zdarzenia wysłania pod element formularza, zatrzymaj akcję domyślną, zbadaj obecność znaku małpy metodą includes i zaktualizuj akapit informacyjny.