Rolf B: JS mit Entertaste Absenden anstatt Button

Beitrag lesen

Hallo portseven,

um der Antwort "Wieso kaputt, funktioniert doch?!" mal vorwegzukommen:

  • Das HTML ist kaputt weil man ein <form> Element nicht mit </div> beendet.
  • Das Script ist konzeptionell kaputt, weil der JavaScript-Helper das Form submitten möchte, sobald das Input-Element den Fokus verliert. Das passiert bei Drücken der TAB Taste oder beim Klick mit der Maus an eine andere Stelle, und es ist etwas ganz anderes als die Enter-Taste
  • Die send-Funktion ist kaputt, weil Elemente mit id auf dem Window-Objekt als globale Variable bereitgestellt werden, nicht auf dem Dokument. Wenn Dokument, dann document.forms.theform. window.theform funktioniert auch, aber nur, weil die Microsofties uns das in den Browser-Kriegen eingebrockt habe, uns den globalen Namespace damit vermüllen und die anderen Browserhersteller der lieben Kompatibilität wegen mitgezogen sind. Es ist leider zu verbreitet, als dass die Hersteller das entfernen könnten, und mittlerweile sogar in der HTML5 Spec angekommen (ächz!), aber MACHEN muss man es nicht. Und document.theform funktioniert definitiv gar nicht.
  • Die Event-Registrierung ist kaputt, weil man heute zum einen nicht mehr mit on-Attributen registriert, und zum anderen derjenige, von dem Du es kopiert hast, nicht recht informiert ist. Es gibt kein unfocus Event. Es heißt blur. Die send()-Funktion wird also nie aktiv, was nichts schadet, weil sie ja sowieso nicht funktionieren würde.

Und warum funktioniert es scheinbar? Weil ein Form mit der ENTER Taste vom Browser automatisch abgeschickt wird. Nur nicht in der Textarea. Weil ENTER da einen Zeilenumbruch auslöst. Und das sollte auch so bleiben, es gibt nichts übleres als vertraute Eingabeelemente, die sich unvertraut verhalten.

Wenn Du einen Hotkey zum Abschicken des Forms haben willst, dann solltest Du dafür eine Tastenkombination wählen, die der ENTER-Taste ähnlich ist. Z.B. Strg+Enter.

Um das zu bauen:

  • registriere mit addEventListener einen DOMContentReady Eventhandler
  • darin registrierst Du einen keypress-Handler auf dem Form
  • in diesem keypress-Handler prüfst Du, ob Ctrl gedrückt wurde und ob die Taste 'Enter' oder 'NumpadEnter' ist. Wenn ja, schickst Du das Form ab.

Die dazu nötigen Informationen findest Du in unserem Wiki. Viel Erfolg!

Rolf

--
sumpsi - posui - clusi