Wie kann ich erkennen, Drücken der Eingabetaste auf der Tastatur mit jQuery?

Question

Ich würde gerne erkennen, ob der Benutzer die Taste Enter mit jQuery.

Wie ist das möglich? Ist dafür ein Plugin erforderlich?

Es sieht so aus, als müsste ich die keypress() método.

Gibt es Browser-Probleme mit diesem Befehl - z. B. Probleme mit der Browserkompatibilität, über die ich Bescheid wissen sollte?

Answer 1

Eine einfache Möglichkeit zu erkennen, ob der Benutzer die Eingabetaste gedrückt hat, ist die Verwendung der Tastennummer die Eingabetastennummer ist =13, um den Wert der Taste 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);
});

Wenn Sie die Eingabetaste drücken, erhalten Sie das Ergebnis 13. Mit dem Schlüsselwert können Sie eine Funktion aufrufen oder tun, was immer Sie wollen.

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

Wenn Sie eine Schaltfläche anvisieren möchten, sobald die Eingabetaste gedrückt wird, können Sie den folgenden Code verwenden

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

Ich hoffe, es hilft

Answer 2

So habe ich es gelöst. Sie sollten verwenden return false;

$(document).on('keypress', function(e) {
    if(e.which == 13) {
        $('#sub_btn').trigger('click');
        alert('You pressed the "Enter" key somewhere');
        return false;
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form action="" method="post" id="sub_email_form">
    <div class="modal-header">
        <button type="button" class="close" id="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Subscribe to our Technical Analysis</h4>
    </div>
    <div class="modal-body">
        <p>Signup for our regular Technical Analysis updates to review recommendations delivered directly in your inbox.</p>
        <div class="input-group">
            <input type="email" name="sub_email" id="sub_email" class="form-control" placeholder="Enter your email" required>
        </div>
        <span id="save-error"></span>
    </div>
    <div class="modal-footer">
        <div class="input-group-append">
            <input type="submit" class="btn btn-primary sub_btn" id="sub_btn" name="sub_btn" value="Subscribe">
        </div>
    </div>
</form>

Answer 3

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

Answer 4

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