Absenden eines Formulars durch Drücken der Eingabetaste, ohne dass eine Schaltfläche zum Absenden vorhanden ist

Question

Ich versuche, ein Formular durch Drücken der Eingabetaste abzuschicken, aber es wird keine Schaltfläche zum Abschicken angezeigt. Ich möchte nicht in JavaScript zu erhalten, wenn möglich, da ich alles auf allen Browsern (die einzige JS Weg, den ich kenne, ist mit Ereignissen) arbeiten möchten.

Im Moment sieht das Formular wie folgt aus:

<form name="loginBox" target="#here" method="post">
    <input name="username" type="text" /><br />
    <input name="password" type="password" />
    <input type="submit" style="height: 0px; width: 0px; border: none; padding: 0px;" hidefocus="true" />
</form>

Das funktioniert ziemlich gut. Die Schaltfläche "Submit" funktioniert, wenn der Benutzer die Eingabetaste drückt, und die Schaltfläche wird in Firefox, IE, Safari, Opera und Chrome nicht angezeigt. Dennoch gefällt mir die Lösung nicht, da es schwer zu sagen ist, ob sie auf allen Plattformen mit allen Browsern funktionieren wird.

Kann jemand eine bessere Methode vorschlagen? Oder ist dies die beste Methode, die es gibt?

Answer 1

input.on('keypress', function(event) {
    if ( event.which === 13 ) {
        form.submit();
        return false;
    }
});

Answer 2

Sie können auch Folgendes versuchen

<INPUT TYPE="image" SRC="0piximage.gif" HEIGHT="0" WIDTH="0" BORDER="0">

Sie könnten ein Bild mit Breite/Höhe = 0 px einfügen

Answer 3

Für diejenigen, die Probleme mit dem IE haben und auch für andere.

{
    float: left;
    width: 1px;
    height: 1px;
    background-color: transparent;
    border: none;
}

Answer 4

Ich habe es zu einer Funktion auf Dokument bereit hinzugefügt. Wenn es keine Submit-Taste auf dem Formular (alle meine Jquery Dialog Forms haben keine Submit-Schaltflächen), fügen Sie es.

$(document).ready(function (){
    addHiddenSubmitButtonsSoICanHitEnter();
});
function addHiddenSubmitButtonsSoICanHitEnter(){
    var hiddenSubmit = "<input type='submit' style='position: absolute; left: -9999px; width: 1px; height: 1px;' tabindex='-1'/>";
    $("form").each(function(i,el){
        if($(this).find(":submit").length==0)
            $(this).append(hiddenSubmit);
    });
}

Answer 5

Hier ist der Code, der bei mir funktioniert hat und Ihnen sicher helfen wird

<form name="loginBox" target="#here" method="post">
  <input name="username" type="text" /><br />
  <input name="password" type="password" />
  <input type="submit" />
</form>

<script type="text/javascript">
  $(function () {
    $("form").each(function () {
      $(this)
        .find("input")
        .keypress(function (e) {
          if (e.which == 10 || e.which == 13) {
            this.form.submit();
          }
        });
      $(this).find("input[type=submit]").hide();
    });
  });
</script>