Wie übergeben Sie einen Wert an eine Funktion und cont ausführen

Question

Ich habe ein Formular und ich validiere die Felder "onblur". Was ich versuche zu tun ist, dass, wenn der Benutzer auf Senden klickt, dass jedes Feld leer ist.

Was ich versuchte, ist, den Wert an eine Funktion übergeben und diese Funktion ausführen, wenn der Benutzer auf "Senden" klicken, aber ich habe ein Problem dabei.

kann mir jemand in die richtige Richtung zeigen, wie ich mein Problem beheben kann.

HTML:

<form method="post" name="registerForms" > 
    <div class="form-group"> 
    <label for="nusernames">Username: <span id="nusernamesErr" class="error">* </span></label> 
    <input type="text" class="form-control" id="nusernames" name="nusernames" onblur="validateForm('nusernames')"> 
    </div> 
    <div class="form-group"> 
    <label for="nemail">Email: <span id="nemailErr" class="error">* </span></label> 
    <input type="email" class="form-control" id="nemail" name="nemail" onblur="validateForm('nemail')"> 
    </div> 
    <input type="submit" class="btn btn-default" value="Submit" id="registerButton"> 
</form> 

JS:

function validateForm(id) 
{ 
    var value = document.getElementById(id).value; 
    var ok = true; 

    if(value === "" || value == null) 
    { 
     document.getElementById(id+'Err').innerHTML = "* <img src='images/unchecked.gif'> Field is required"; 
     ok = false 
     yesNo(ok); 
    } 
    else 
    { 
     document.getElementById(id+'Err').innerHTML = "* "; 
    } 
} 

var button = document.getElementById('#registerButton'); 

button.onclick = function yesNo(ok) 
{ 
    alert("There's something wrong with your information!") 
    if(ok == false) 
    { 
     alert("There's something wrong with your information!") 
     return false; 
    } 
} 

Answer 1

zu lösen schien Wenn Sie die Validierung auf dem Click-Ereignis anhängen möchten für Ihre Absenden-Button Ich würde Ihnen vorschlagen, Wiederholen Sie die Überprüfung für jedes Eingabefeld wie bei einem Blur-Ereignis.

Darüber hinaus würde ich vorschlagen, dass Sie die ok Wert als Attribut für jedes Eingabefeld speichern. Setzen Sie diese Attribute auf "dom" auf "false" und ändern Sie sie in "validateForm" in "true/false".

Beim Einreichen ist es eine gute Idee, Ihre Valodator-Funktion auszuführen und auf falsche Felder zu testen.

Sie können addEventListener verwenden, um einen Event-Handler zu registrieren, querySelectorAll für die Auswahl von Elementen.

Das Snippet:

function validateForm(id) { 
 
    var value = document.getElementById(id).value; 
 

 
    if (value === "" || value == null) { 
 
     document.getElementById(id+'Err').innerHTML = "* <img src='images/unchecked.gif'> Field is required"; 
 
     document.getElementById(id).setAttribute('yesNo', 'false'); 
 
    } else { 
 
     document.getElementById(id+'Err').innerHTML = "* "; 
 
     document.getElementById(id).setAttribute('yesNo', 'true'); 
 
    } 
 
} 
 

 
document.addEventListener('DOMContentLoaded', function(e) { 
 
    document.querySelectorAll('form[name="registerForms"] input:not([type="submit"])').forEach(function(ele, idx) { 
 
     ele.setAttribute('yesNo', 'false'); 
 
    }); 
 
    document.getElementById('registerButton').addEventListener('click', function(e) { 
 

 
     var ok = true; 
 

 
     document.querySelectorAll('form[name="registerForms"] input:not([type="submit"])').forEach(function(ele, idx) { 
 
      validateForm(ele.id); 
 
      if (ele.getAttribute('yesNo') == 'false') { 
 
       ok = false; 
 
      } 
 
     }); 
 

 
     if (ok == false) { 
 
      console.log("There's something wrong with your information!") 
 
      e.preventDefault(); 
 
     } 
 
    }); 
 
});

<form method="post" name="registerForms" action="http://www.google.com"> 
 
    <div class="form-group"> 
 
     <label for="nusernames">Username: <span id="nusernamesErr" class="error">* </span></label> 
 
     <input type="text" class="form-control" id="nusernames" name="nusernames" onblur="validateForm('nusernames')"> 
 
    </div> 
 
    <div class="form-group"> 
 
     <label for="nemail">Email: <span id="nemailErr" class="error">* </span></label> 
 
     <input type="email" class="form-control" id="nemail" name="nemail" onblur="validateForm('nemail')"> 
 
    </div> 
 
    <input type="submit" class="btn btn-default" value="Submit" id="registerButton"> 
 
</form>

Answer 2

Sie versuchten var Knopf mit diesem var Taste = document.getElementById ('# registerButton') zu definieren;

aber es muss dies mit regelmäßigen Javascript sein

var button = document.getElementById('registerButton'); 

, dass das Problem