Fehlermeldung funktioniert nicht in einfacher JavaScript-Formularüberprüfung

Hier ist der folgende Code, der nicht funktioniert, Fehlermeldung beim Übermitteln anzuzeigen.Fehlermeldung funktioniert nicht in einfacher JavaScript-Formularüberprüfung

Das Problem ist, dass die Fehlermeldung nicht richtig angezeigt wird, wenn Sie einmal klicken, aber wenn Sie mehrere Klicks geben, funktioniert es.

Hilfe wird geschätzt.

Dank

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
    <title>JavaScript form validation - checking all letters</title> 

    <style type="text/css">  
     li {list-style-type: none; 
     font-size: 16pt; 
     } 
     .mail { 
      margin: auto; 
      padding-top: 10px; 
      padding-bottom: 10px; 
      width: 400px; 
      background : #D8F1F8; 
      border: 1px soild silver; 
     } 
     .mail h2 { 
      margin-left: 38px; 
     } 
     input { 
      font-size: 20pt; 
     } 
     input:focus, textarea:focus{ 
      background-color: lightyellow; 
     } 
     input submit { 
      font-size: 12pt; 
     } 
     .rq { 
      color: #FF0000; 
      font-size: 10pt; 
     } 
    </style> 

</head> 
<body onload='document.form1.text1.focus()'> 
    <div class="mail"> 
     <h2>Enter your Name and Submit</h2> 
     <form name="form1" action="#"> 
      <ul> 
       <li> 
        Code: 
       </li> 
       <li id="myList"> 
        <input type='text' name='text1'/> 
        <p id="error"></p> 
       </li> 
       <li class="rq"> 
        *Enter alphabets only. 
       </li> 
       <li>&nbsp;</li> 
       <li> 
        <input type="submit" name="submit" value="Submit" onclick="allLetter(document.form1.text1)" /> 
       </li> 
       <li>&nbsp;</li> 
      </ul> 
     </form> 
    </div> 

    <script type="text/javascript"> 
     function allLetter(inputtxt) {  
      var letters = /^[A-Za-z]+$/; 
      if(inputtxt.value.match(letters)) { 
       document.getElementById("error").innerHTML="error here"; 
       return false; 
      } else { 
       document.getElementById("error").innerHTML="success"; 
       return true; 
      } 
     } 
    </script> 
</body> 
</html>

Quelle

2017-07-18 narend

Das gleiche Problem hier https://stackoverflow.com/questions/4882691/javascript-error -val-match-is-not-a-function –

Mögliches Duplikat von [Javascript-Fehler: "val.match ist keine Funktion"] (https://stackoverflow.com/questions/4882691/javascript-error-val-match -is-not-a-function) –

ist Ihr Problem und die Lösung ganz einfach.

Wenn Sie auf die Formularschaltfläche klicken, wird das Formular automatisch übermittelt und deshalb sehen Sie nichts. Fügen Sie diesen Code auf Ihre Schaltfläche so können Sie die Standardfunktionalität des Eingangs einreichen verhindern:

Quelle

2017-07-18 13:04:42 MaVRoSCy

Hallo, es hat funktioniert .. danke für die Unterstützung. Kannst du mir bitte ein paar Referenzen nennen, wo ich tiefgreifendes JavaScript-Wissen durchgehen kann? – narend

Sie sollten verwenden Event.preventDefault Methode:

<input type="submit" name="submit" value="Submit" onclick="allLetter(document.form1.text1);return false" />

dass es lösen soll um die Seitenaktualisierung zu verhindern. So sollte Ihre Funktion wie folgt aussehen:

function allLetter(event) { 
     event.preventDefault(); 
     var letters = /^[A-Za-z]+$/; 
     if (document.form1.text1.value.match(letters)) { 
      document.getElementById("error").innerHTML="error here"; 
      //return false; 
     } else { 
      document.getElementById("error").innerHTML="success"; 
      return true; 
     } 
    }

Es ist in der folgenden Art und Weise aufgerufen werden soll: <input type="submit" name="submit" value="Submit" onclick="allLetter(event)" />

Quelle

2017-07-18 13:14:09

Hallo, es hat funktioniert .. danke für die Unterstützung. Kannst du mir bitte ein paar Referenzen nennen, wo ich tiefgreifendes JavaScript-Wissen durchgehen kann? – narend

Gern geschehen. Dies ist ein ausgezeichnetes Buch über das JavaScript: http://shop.oreilly.com/product/9780596805531.do. Wenn Sie Video-Tutorials bevorzugen, ist dies die beste Wahl: https://www.pluralsight.com/paths/javascript –

Fehlermeldung funktioniert nicht in einfacher JavaScript-Formularüberprüfung

Antwort

Verwandte Themen