Erkennen Sie die Eingabetaste in einem Texteingabefeld


299

Ich versuche eine Funktion auszuführen, wenn bei einer bestimmten Eingabe die Eingabetaste gedrückt wird.

Was mache ich falsch?

$(document).keyup(function (e) {
    if ($(".input1").is(":focus") && (e.keyCode == 13)) {
        // Do something
    }
});

Gibt es eine bessere Möglichkeit, dies zu .input1tun , wenn die Eingabetaste gedrückt wird ?


Antworten:


499
$(".input1").on('keyup', function (e) {
    if (e.keyCode === 13) {
        // Do something
    }
});


//keyup not compatible with Jquery select(), Keydown is.

In welchem ​​Browser haben Sie es getestet? Ich denke, ältere Versionen von IE lösen keine Keyup-Ereignisse im Dokument aus (sind sich jedoch nicht sicher).
Joseph Silber

2
Ihr Code hat nicht funktioniert, weil Sie .is () verwendet haben und === statt == benötigt haben. Siehe meine Antwort für weitere Details.
Wesbos

6
@jQuerybeast Es wird nicht benötigt und event.keyCodeist ein Number, daher unternimmt JavaScript die gleichen Schritte mit ==oder ===.
Alex

7
e.was als nützlicher Cross-Browser
deklariert wird

2
Eigenschaften which, code, charCodeund keyCodesind veraltet developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent , bitte aktuelle Informationen zu Ihrer Antwort hinzufügen.
Sasay

120

event.key === "Enter"

Neuere und viel sauberere: verwenden event.key. Keine willkürlichen Nummerncodes mehr!

const node = document.getElementsByClassName(".input")[0];
node.addEventListener("keyup", function(event) {
    if (event.key === "Enter") {
        // Do work
    }
});

Wenn Sie jQuery verwenden müssen:

$(document).keyup(function(event) {
    if ($(".input1").is(":focus") && event.key == "Enter") {
        // Do work
    }
});

Mozilla Docs

Unterstützte Browser


6
Ein großes Lob für die einfache Javascript-Version, nicht sicher, warum alle anderen in jquery sind
Captain Fantastic

7
Weil das OP seinen Beispielcode in jQuery einfügt und (sowie JavaScript) jQuery markiert ist.
Tigerrrrr

44
$(document).keyup(function (e) {
    if ($(".input1:focus") && (e.keyCode === 13)) {
       alert('ya!')
    }
 });

Oder binden Sie einfach an die Eingabe selbst

$('.input1').keyup(function (e) {
    if (e.keyCode === 13) {
       alert('ya!')
    }
  });

Verwenden Sie die Website http://keycode.info , um herauszufinden, welchen Schlüsselcode Sie benötigen


Danke dir. Ich habe etwas Neues gelernt. Übrigens habe ich .is () VIELE Male benutzt, also ist es keine Logik, nicht zu arbeiten. Auch die ==, wieder habe ich zwei == für andere Situationen verwendet
jQuerybeast

np, du solltest immer ===
wesbos

12

Versuchen Sie dies, um die Enterin einem Textfeld gedrückte Taste zu erkennen .

$(function(){

$(".input1").keyup(function (e) {
    if (e.which == 13) {
        // Enter key pressed
    }
 });

});

6

Es kann zu spät sein, diese Frage zu beantworten. Der folgende Code verhindert jedoch einfach die Eingabetaste. Einfach kopieren und einfügen sollte funktionieren.

        <script type="text/javascript"> 
        function stopRKey(evt) { 
          var evt = (evt) ? evt : ((event) ? event : null); 
          var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); 
          if ((evt.keyCode == 13) && (node.type=="text"))  {return false;} 
        } 

        document.onkeypress = stopRKey; 

        </script>

6

Der beste Weg, den ich gefunden habe, ist die Verwendung keydown(das keyupfunktioniert bei mir nicht gut).

Hinweis: Ich habe auch das Senden des Formulars deaktiviert, da Sie normalerweise nur das Formular senden möchten, wenn Sie beim Drücken der Eingabetaste einige Aktionen ausführen möchten :)

$('input').keydown( function( event ) {
    if ( event.which === 13 ) {
        // Do something
        // Disable sending the related form
        event.preventDefault();
        return false;
    }
});

event.keyCode ist veraltet event.which nicht, also ist das besser
Alex

3

Die Lösung, die für mich funktioniert, ist die folgende

$("#element").addEventListener("keyup", function(event) {
    if (event.key === "Enter") {
        // do something
    }
});

1

Versuchen Sie dies, um die in einem Textfeld gedrückte Eingabetaste zu erkennen.

$(document).on("keypress", "input", function(e){
    if(e.which == 13){
        alert("Enter key pressed");
    }
});

DEMO


0
 $(document).ready(function () {
        $(".input1").keyup(function (e) {
            if (e.keyCode == 13) {
                // Do something
            }
        });
    });

0

Dieser Code behandelte jede Eingabe für mich auf der gesamten Site. Es sucht in einem INPUT-Feld nach der ENTER-TASTE und stoppt nicht bei TEXTAREA oder anderen Stellen.

$(document).on("keydown", "input", function(e){
 if(e.which == 13){
  event.preventDefault();
  return false;
 }
});
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.