Erfahren Sie in dieser Anleitung, wie Sie eine Altersüberprüfung für Newsletter-Anmeldungen mit JavaScript implementieren können. Die Validierung stellt sicher, dass sich nur Personen ab 16 Jahren für den Newsletter anmelden können.
Verhalten
Wenn Nutzer:innen das erforderliche Mindestalter noch nicht erreicht haben, können sie das Formular zwar ausfüllen und absenden, sich jedoch nicht erfolgreich für den Newsletter anmelden.
Beim Versuch, das Formular mit aktivierter Newsletter-Anmeldung abzusenden oder zur nächsten Seite zu navigieren, erhalten sie eine Fehlermeldung. Diese informiert sie darüber, dass sie das erforderliche Mindestalter für die Newsletter-Anmeldung noch nicht erreicht haben.
Zentrale Formularelemente
Die JavaScript-Validierung bezieht sich auf zwei zentrale Formularelemente:
Ein Eingabefeld für das Geburtsdatum (technischer Name: "birthday"), in dem das eingegebene Datum im Format "dd.MM.yyyy" validiert und auf das erforderliche Mindestalter von 16 Jahren geprüft wird.
Eine Einfachauswahl für die Newsletter-Anmeldung (technischer Name: "newsletter") mit dem zu überprüfenden Optionswert "ja". Das Validierungsergebnis des Geburtsdatums hat direkten Einfluss auf diese Einfachauswahl - nur bei erreichtem Mindestalter ist eine Newsletter-Anmeldung möglich. Andernfalls kann das Formular nur ohne Newsletter-Anmeldung abgesendet werden.
Erforderliche Formularelemente
Für die Altersprüfung werden die folgenden Formularelemente benötigt:
Eingabefeld für Geburtsdatum
Technischer Name: birthday
Datumsformat: dd.MM.yyyy (Wichtig: Wählen Sie das Format in der zugehörigen Auswahl) Beispiel: 01.03.2000 für den 1. März 2000
Funktion: In dieses Eingabefeld tragen Nutzer:innen ihr Geburtsdatum ein. Es wird automatisch das Alter berechnet und geprüft, ob die Person mindestens 16 Jahre alt ist.
Einfachauswahl für Newsletter
Technischer Name: newsletter
Zu prüfende Option: ja
Funktion: Hier können Nutzer:innen auswählen, ob sie den Newsletter erhalten möchten oder nicht
JavaScript-Code einfügen
Um die Altersvalidierung zu implementieren, fügen Sie den folgenden JavaScript-Code in das Validierungstextfeld Ihres Formulars ein:
So verwenden Sie den Code
Öffnen Sie die Formularseite mit dem Eingabefeld für das Geburtsdatum und der Newsletter-Einfachauswahl.
Navigieren Sie zum Abschnitt Validierung.
Schieben Sie den Schalter bei Validierung nach rechts, um die Funktion zu aktivieren.
Wählen Sie die Option JavaScript aus.
Fügen Sie im Feld Validierungsskript den Code-Block in die geschweifte Klammer der validate()-Funktion ein.
Was der Code macht
Die Funktion parseAge() berechnet das Alter basierend auf dem eingegebenen Geburtsdatum
Die Validierung prüft zwei Bedingungen:
Ist die Newsletter-Option "ja" ausgewählt?
Ist das berechnete Alter unter 16 Jahren?
Mögliche Ergebnisse
Fall 1: Newsletter gewählt UND Alter < 16
Fehlermeldung erscheint
Formular kann nicht abgesendet werden
Fall 2: Alle anderen Fälle
Keine Fehlermeldung
Formular kann normal abgesendet werden
Testen der Validierung
Prüfen Sie nach der Einrichtung die folgenden Szenarien, um sicherzustellen, dass das Formular wie gewünscht funktioniert:
Nutzer:in über 16 Jahre mit Newsletter-Anmeldung
Nutzer:in unter 16 Jahre mit Newsletter-Anmeldung
Nutzer:in unter 16 Jahre ohne Newsletter-Anmeldung
Bei unerwartetem Verhalten oder offenen Fragen können Sie sich gerne über das Feedback-Formular an uns wenden.
