Wie zu erkennen, auf der Tastatur durch Drücken der Eingabetaste mit jQuery?

Question

Ich möchte feststellen, ob der Benutzer gedrückt hat Enter mit jQuery.

Wie ist das möglich? Gibt es ein Plugin erforderlich?

EDIT: Es sieht aus wie ich die keypress() Methode verwenden müssen.

wollte ich wissen, ob jemand weiß, ob es Browser-Probleme mit diesem Befehl sind - wie gibt es irgendwelche Browser Kompatibilitätsprobleme ich wissen sollte

Answer 1

Der ganze Sinn von jQuery ist, dass Sie nicht über Browser-Unterschiede zu kümmern. Ich bin mir ziemlich sicher, dass Sie sicher mit gehen eingeben wobei 13 in allen Browsern. Also in diesem Sinne, Sie können dies tun:

$(document).on('keypress',function(e) {
    if(e.which == 13) {
        alert('You pressed enter!');
    }
});

Answer 2

Ich schrieb ein kleines Plugin es leichter zu binden, die „auf Enter-Taste gedrückt“ ein Ereignis zu machen:

$.fn.enterKey = function (fnc) {
    return this.each(function () {
        $(this).keypress(function (ev) {
            var keycode = (ev.keyCode ? ev.keyCode : ev.which);
            if (keycode == '13') {
                fnc.call(this, ev);
            }
        })
    })
}

Verbrauch:

$("#input").enterKey(function () {
    alert('Enter!');
})

Answer 3

kann ich nicht den Code erhalten, indem @Paolo Bergantino geschrieben, sondern zu arbeiten, wenn ich ändere es $(document) und e.which statt e.keyCode dann fand ich es einwandfrei zu arbeiten.

$(document).keypress(function(e) {
    if(e.which == 13) {
        alert('You pressed enter!');
    }
});

Link zum Beispiel auf JS Bin

Answer 4

Ich fand das mehr sein Cross-Browser kompatibel:

$(document).keypress(function(event) {
    var keycode = event.keyCode || event.which;
    if(keycode == '13') {
        alert('You pressed a "enter" key in somewhere');    
    }
});

Answer 5

Sie können dies tun, um die jquery 'keyDown' Ereignishandle mit

   $( "#start" ).on( "keydown", function(event) {
      if(event.which == 13) 
         alert("Entered!");
    });

Answer 6

ich irgendwann verbrachte mit dieser Lösung kommen ich hoffe, dass es jemand hilft.

$(document).ready(function(){

  $('#loginforms').keypress(function(e) {
    if (e.which == 13) {
    //e.preventDefault();
    alert('login pressed');
    }
  });

 $('#signupforms').keypress(function(e) {
    if (e.which == 13) {
      //e.preventDefault();
      alert('register');
    }
  });

});

Answer 7

Es gibt eine keypress () Ereignismethode. Die ascii Nummer der Enter-Taste ist 13 und ist nicht abhängig von dem Browser verwendet wird.

Answer 8

Verwenden event.key und moderne JS!

$(document).keypress(function(event) {
    if (event.key === "Enter") {
        // Do something
    }
});

oder ohne jQuery:

document.addEventListener("keypress", function onEvent(event) {
    if (event.key === "Enter") {
        // Do something better
    }
});

Mozilla Docs

Unterstützte Browser

Answer 9

Eine geringfügige Erweiterung von Andrea Antwort oben macht die Hilfsmethode nützliche, wenn Sie auch die Eingabetaste drückt geändert aufnehmen möchten können (das heißt ctrl-Eingabe oder Shift-Eingabe). Zum Beispiel ermöglicht diese Variante verbindlich wie:

$('textarea').enterKey(function() {$(this).closest('form').submit(); }, 'ctrl')

ein Formular einzureichen, wenn der Benutzer mit Fokus ctrl-Eingabe drückt auf dieses Textfeld des Formulars.

$.fn.enterKey = function (fnc, mod) {
    return this.each(function () {
        $(this).keypress(function (ev) {
            var keycode = (ev.keyCode ? ev.keyCode : ev.which);
            if ((keycode == '13' || keycode == '10') && (!mod || ev[mod + 'Key'])) {
                fnc.call(this, ev);
            }
        })
    })
}

(siehe auch Strg + Enter jQuery in TEXTAREA- )

Answer 10

In einigen Fällen müssen Sie die ENTER Schlüssel für einen bestimmten Bereich einer Seite zu unterdrücken, aber nicht für andere Bereiche einer Seite, wie die Seite unterhalb enthält ein Header <div> mit einem SEARCH ein.

Es hat mir ein wenig, um herauszufinden, wie dies zu tun, und ich dieses einfaches, aber vollständiges Beispiel bin Entsendung hier für die Gemeinschaft auf.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Test Script</title>
  <script src="/lib/js/jquery-1.7.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $('.container .content input').keypress(function (event) {
      if (event.keyCode == 10 || event.keyCode == 13) {
        alert('Form Submission needs to occur using the Submit button.');
        event.preventDefault();
      }
    });
  </script>
</head>
  <body>
    <div class="container">
      <div class="header">
        <div class="FileSearch">
          <!-- Other HTML here -->
        </div>
      </div>
      <div class="content">
        <form id="testInput" action="#" method="post">
        <input type="text" name="text1" />
        <input type="text" name="text2" />
        <input type="text" name="text3" />
        <input type="submit" name="Submit" value="Submit" />
        </form>
      </div>
    </div>
  </body>
</html>

Link zu JSFiddle Spielplatz : Die [Submit] Taste nicht alles tun, aber mit ENTER von einer der Textfeld-Steuerelemente das Formular nicht.

Answer 11

Dieses Versuchen Sie die Enter-Taste gedrückt zu erkennen.

$(document).on("keypress", function(e){
    if(e.which == 13){
        alert("You've pressed the enter key!");
    }
});

Siehe Demo @ erkennen Enter-Taste drückt auf der Tastatur

Answer 12

keypress Methode verwenden zu erfassen Drücken der Eingabetaste auf der Tastatur mit jQuery?

https://www.tutsmake.com/ jquery-keypress-Event-detect-Enter-Taste-gedrückt /

        $('#someTextBox').keypress(function(event){
            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
                alert('You pressed a "enter" key in textbox'); 
            }
            event.stopPropagation();
        });
    

<html>
<head>
<title>jQuery keypress() Method To Detect Enter key press or not Example</title> 
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
    <h1>Write something here & press enter</h1>
    <label>TextBox Area: </label>
    <input id="someTextBox" type="text" size="100" />
 
</body>
</html>

Answer 13

Die einfache Art und Weise zu erkennen, ob der Benutzer gedrückt hat eingeben, ist die Schlüsselnummer eingeben Schlüsselnummer ist = 13 zu verwenden, um den Wert des Schlüssels in Ihrem Gerät zu überprüfen

$("input").keypress(function (e) {
  if (e.which == 32 || (65 <= e.which && e.which <= 65 + 25)
                    || (97 <= e.which && e.which <= 97 + 25)) {
    var c = String.fromCharCode(e.which);
    $("p").append($("<span/>"))
          .children(":last")
          .append(document.createTextNode(c));
  } else if (e.which == 8) {
    // backspace in IE only be on keydown
    $("p").children(":last").remove();
  }
  $("div").text(e.which);
});

Durch Drücken der Taste geben Sie als 13 erhalten führen. den Schlüsselwert verwenden, können Sie eine Funktion aufrufen oder tun, was Sie wollen

        $(document).keypress(function(e) {
      if(e.which == 13) {
console.log("User entered Enter key");
          // the code you want to run 
      }
    });

Wenn Sie wollen, sobald eine Taste zum Ziel Enter-Taste gedrückt wird Sie den Code verwenden können,

    $(document).bind('keypress', function(e){
  if(e.which === 13) { // return
     $('#butonname').trigger('click');
  }
});

Hoffe, dass es helfen

Answer 14

Ich denke, die einfachste Methode wäre mit Vanille Javacript:

document.onkeyup = function(event) {
   if (event.key === 13){
     alert("enter was pressed");
   }
}

Answer 15

$(function(){
  $('.modal-content').keypress(function(e){
    debugger
     var id = this.children[2].children[0].id;
       if(e.which == 13) {
         e.preventDefault();
         $("#"+id).click();
       }
   })
});

Answer 16

$(document).keyup(function(e) {
    if(e.key === 'Enter') {
        //Do the stuff
    }
});