JavaScript-Funktion funktioniert nur einmal

Question

Ich habe versucht, Java-Skript zu verwenden, um ein Kontaktformular zu validieren. Die Idee ist, ein Absatz-Tag über jedem Textfeld hinzuzufügen und wenn der Absenden-Button angeklickt wird, sollte eine JavaScript-Funktion ausgelöst werden. Wenn das Textfeld leer ist, wird die "versteckte" Klasse aus der Klassenliste des Absatzes entfernt, so dass sie sichtbar ist. Das Problem ist, dass die Funktion nur einmal ausgelöst wird, das erste Mal, wenn ich auf die Schaltfläche klicke. aber wenn ich Textbox ausfülle und erneut klicke, wird die Funktion nicht ausgelöst. kann mir irgendein Körper dabei helfen? Hinweis: Wenn ich getElementById verwende, wird die Funktion nicht ausgelöst und der Compiler wechselt zur serverseitigen Funktion btnSubmit_Click, aber wenn getElementByName verwendet wird, wird die Funktion nur einmal wie oben beschrieben ausgelöst.

 <div id="contactForm" runat="server"> 
      <div class="control-group form-group"> 
       <div class="controls"> 
        <p id="errname" class="hidden">You must insert your <b>name</b></p> 
        <input type="text" runat="server" class="form-control" id="txtname" name="txtname" placeholder="*Full Name" > 
       </div> 
      </div>    
      <div class="control-group form-group"> 
       <div class="controls"> 
        <p id="erremail" class="hidden">You must insert your <b>email</b></p> 
        <input type="email" runat="server" class="form-control" id="txtemail" name="txtemail" placeholder="*Email" > 
       </div> 
      </div> 
      <div class="control-group form-group"> 
       <div class="controls"> 
        <p id="errmessage" class="hidden">You must insert a <b>message</b></p> 
        <textarea runat="server" rows="10" cols="100" class="form-control" id="txtmessage" name="txtmessage" placeholder="*Message" maxlength="999" style="resize:none"></textarea> 
       </div> 
      </div> 
      <asp:Button ID="btnSubmit" runat="server" OnClientClick="return myfun();" OnClick="btnSubmit_Click" Text="Send Message" class="btn btn-primary btn-block" /> 
     </div> 

und die Javascript-Funktion ist:

function myfun() { 
     document.getElementById("errname").classList.add('hidden'); 
     document.getElementById("erremail").classList.add('hidden'); 
     document.getElementById("errmessage").classList.add('hidden'); 

     var flag = true; 
     if (!document.getElementsById("txtname").value) { 
      document.getElementById("errname").classList.remove('hidden'); 
      flag= false; 
     } 

     if (!document.getElementsById("txtemail").value) { 
      document.getElementById("erremail").classList.remove('hidden'); 
      flag= false; 
     } 

     if (!document.getElementsById("txtmessage").value) { 
      document.getElementById("errmessage").classList.remove('hidden'); 
      flag = false; 
     } 
     if (flag == false) { return false;} 

    } 
</script> 

Answer 1

sie durch Zugabe von ClientIDMode = "statisch", um die Textfelder durchgeführt wird, die in der JavaScript-Funktion

    <input type="text" runat="server" class="form-control" id="txtname" name="txtname" placeholder="*Full Name" clientIdMode="static"> 

Answer 2

Ihre JS können genannt werden gib niemals wahr zurück. Sie haben:

if(flag == false) {return false;} 

Aber Sie sagen es nie wieder wahr. Anstelle der Linie oben, warum nicht einfach:

return flag; 

Da Sie den Wert von true in false ändern, wenn ein Fehler vorliegt, wird es zurückgeben, was der Wert von flag ist.