Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lære Udfordring: Implementering af Event-Lyttere | Håndtering af Hændelser og Brugerinteraktioner i JavaScript
Avanceret JavaScript-Mestring

bookUdfordring: Implementering af Event-Lyttere

Opgave

Du opretter en formular, hvor brugere kan indsende deres oplysninger. Målet er at validere brugerinput, give feedback i realtid, mens de skriver, og forhindre formularindsendelse, hvis inputtet er ugyldigt.

  1. Feedback i realtid på input:
    • Lyt efter ændringer, mens brugeren skriver;
    • Inde i event handleren kontrolleres længden af inputværdien;
    • Hvis den er mindre end 3 tegn, sættes indholdet af <p> med ID feedback til "Name is too short.";
    • Hvis den er 3 tegn eller mere, sættes feedback til "Name looks good!".
  2. Forhindr standardformularindsendelse:
    • Lyt efter formularindsendelser;
    • Stop formularen fra at udføre standardindsendelsesadfærden;
    • Kontroller inputværdien;
    • Hvis den er mindre end 3 tegn, vises "Please enter a longer name" i <p> med ID form-message;
    • Hvis den er 3 tegn eller mere, vises "Form submitted successfully!" i form-message.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Brug input-begivenheden til at lytte efter ændringer, mens brugeren skriver;
  • Brug event.target.value.length < 3 til at kontrollere længden af inputværdien;
  • Brug submit-begivenheden til at lytte efter formularindsendelser;
  • Brug event.preventDefault() for at stoppe formularen fra standardindsendelsesadfærden;
  • Brug nameInput.value.length < 3 til at kontrollere inputværdien.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 3

Spørg AI

expand

Spørg AI

ChatGPT

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Awesome!

Completion rate improved to 2.22

bookUdfordring: Implementering af Event-Lyttere

Stryg for at vise menuen

Opgave

Du opretter en formular, hvor brugere kan indsende deres oplysninger. Målet er at validere brugerinput, give feedback i realtid, mens de skriver, og forhindre formularindsendelse, hvis inputtet er ugyldigt.

  1. Feedback i realtid på input:
    • Lyt efter ændringer, mens brugeren skriver;
    • Inde i event handleren kontrolleres længden af inputværdien;
    • Hvis den er mindre end 3 tegn, sættes indholdet af <p> med ID feedback til "Name is too short.";
    • Hvis den er 3 tegn eller mere, sættes feedback til "Name looks good!".
  2. Forhindr standardformularindsendelse:
    • Lyt efter formularindsendelser;
    • Stop formularen fra at udføre standardindsendelsesadfærden;
    • Kontroller inputværdien;
    • Hvis den er mindre end 3 tegn, vises "Please enter a longer name" i <p> med ID form-message;
    • Hvis den er 3 tegn eller mere, vises "Form submitted successfully!" i form-message.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Brug input-begivenheden til at lytte efter ændringer, mens brugeren skriver;
  • Brug event.target.value.length < 3 til at kontrollere længden af inputværdien;
  • Brug submit-begivenheden til at lytte efter formularindsendelser;
  • Brug event.preventDefault() for at stoppe formularen fra standardindsendelsesadfærden;
  • Brug nameInput.value.length < 3 til at kontrollere inputværdien.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 3
some-alt