Javascript Formular Funktion nicht

Question

Hier wirft ist die Form:

<form name="loginForm" id="loginForm" method="post"> 
    <!-- <label>UserName :</label> --> 
    <input id="name" name="username" placeholder="username" type="text" autofocus> 
    <!-- <label>Password :</label> --> 
    <!-- <input id="password" name="password" placeholder="**********" type="password"> --> 
    <input name="submit" type="submit" value=" Login "> 
</form> 

Und das Skript:

document.getElementById("name").addEventListener("keypress", submitForm); 
function submitForm() { 
    // document.getElementById("loginForm").submit(); 
    document.forms.loginForm.submit(); 
    // alert("Yay, You got this far!"); 
} 

Die Funktion submitForm aufgerufen wird, aber die Form nicht, es sei denn Rückkehr vorgelegt bekommt/Enter wird gedrückt. Ich habe versucht, die Submit-Eingabe umzubenennen, die dann wiederum die Eingabe akzeptiert, scheint den Funktionsaufruf zu machen, aber anstatt das Formular zu übermitteln, wird das Formular einfach aktualisiert und das Eingabetextfeld gelöscht.

Answer 1

Es würde wahrscheinlich besser mit einem Action-Attribut arbeiten. Durch die Art und Weise sollten Sie Ihre leere Elemente mit />

<form name="loginForm" id="loginForm" method="post" action="http://localhost:80/my_awesome_form_handler.php"> 
    <input id="name" name="username" placeholder="username" type="text"/> 
    <input name="submit" type="submit" value=" Login "/> 
</form> 

Answer 2

schließen Sie nicht ein Ereignis-Listener für diese benötigen. Dies sollte für Sie funktionieren:

Ihr Formular-Tag muss eine Aktion Attribut haben. Zeigen Sie auf das Skript, das Ihr Formular verarbeitet.

<form name="loginForm" id="loginForm" method="post" action="script.php"> 
<!-- <label>UserName :</label> --> 
<input id="name" name="username" placeholder="username" type="text" autofocus> 
<!-- <label>Password :</label> --> 
<!-- <input id="password" name="password" placeholder="**********" type="password"> --> 
<input name="submit" type="submit" value=" Login "> 
</form> 

Für die Javascript, mit jQuery:

jQuery(document).ready(function($) { 
    $('#loginForm').on('submit', null, function() { 
     $(this).submit(); 
    }); 
} 

Wenn Sie tatsächlich sind versuchen, das Formular zu senden, jedes Mal ein Zeichen im Namensfeld eingegeben wird, dann können Sie tun:

jQuery(document).ready(function($) { 
    $('#name').on('keyup', null, function(e) { 
     e.preventDefault(); 
     $('#loginForm').submit(); 
    }); 
}