Aufgabe auf ../../events-window-object.html

Hier sind die Events, die individuelle Eingaben abfangen:

<form id="myform" action="anfrage.php" method="post">
   <input placeholder="Name" id="reqname" type="text" name="reqname" value="">
   <input placeholder="E-Mail" id="reqemail" type="email" name="reqemail" value="">
   <input placeholder="Telefon" id="reqphone" type="tel" name="reqphone" value="">
   <textarea id="reqtext" name="reqtext">Ihr Anliegen</textarea>
   <div class="emsg"></div>
   <input class="btn" type="submit" value="Senden">
</form>
const form = document.querySelector("#myform");
form.addEventListener("submit", function (evt) {
   evt.preventDefault();
   const reqname = document.querySelector("#reqname").value;
   document.querySelector(".emsg").innerText = "";
   
   // Name testen
   let result = /^([ \u00c0-\u01ffa-zA-Z\.' \-]{3,})+$/.test(reqname);

   if (!result) {
      document.querySelector(".emsg").innerText = "Der Name muss mindestens drei Zeichen lang sein.";
   }
   
   // E-Mail testen
   const reqemail = document.querySelector("#reqemail").value;
   result = /^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/.test(reqemail);
   
   if (!result) {
      document.querySelector(".emsg").innerText += "\nBitte prüfen Sie die E-Mail-Adresse!";
   }
   
   // Telefonnummer testen
   const reqphone = document.querySelector("#reqphone").value;
   result = /^([0-9\.-\/ ()]{7,})$/.test(reqphone);
   
   if (!result) {
      document.querySelector(".emsg").innerText += "\nBitte prüfen Sie die Telefonnummer!";
   }
   
   // Text prüfen
   const text = document.querySelector("#reqtext").value;
   result = /^([ \u00c0-\u01ffa-zA-Z\.' \-]{30,})+$/.test(text);
   
   if (!result) {
      document.querySelector (".emsg").innerText += "\nBitte erklären Sie Ihr Anliegen" + 
                                                    "mit ein oder zwei Sätzen.";
   }
   
   // Wenn alle Werte als korrekt erkannt werden
   if (result) {
      form.submit(); // Formularinformationen absenden
   }
});