Come rilevare premendo Invio sulla tastiera utilizzando jQuery?

Question

Vorrei rilevare se l'utente ha premuto Invio utilizzando jQuery.

Come è possibile? C'è bisogno di un plugin?

EDIT: Sembra che ho bisogno di usare il href="http://docs.jquery.com/Events/keypress" rel="noreferrer"> keypress() metodo

Volevo sapere se qualcuno sa se ci sono problemi di browser con quel comando -? Come se non ci sono problemi di compatibilità del browser che dovrei sapere

Answer 1

Il punto di jQuery è che non devi preoccuparti di differenze tra i browser. Sono abbastanza sicuro che si può tranquillamente andare con Invio essere 13 in tutti i browser. Quindi, con questo in mente, si può fare questo:

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

Answer 2

ho scritto un piccolo plugin per rendere più facile associare il "sul tasto Invio premuto" un evento:

$.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);
            }
        })
    })
}

Utilizzo:

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

Answer 3

non ho potuto ottenere il codice inviato da @Paolo Bergantino a lavorare, ma quando ho cambiato in $(document) e e.which invece di e.keyCode poi ho trovato a lavorare senza errori.

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

link di esempio su JS Bin

Answer 4

Ho trovato questo per essere più cross-browser compatibile:

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

Answer 5

È possibile farlo usando il jquery 'KeyDown' impugnatura evento

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

Answer 6

ho trascorso qualche tempo a venire con questa soluzione spero che aiuta qualcuno.

$(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

C'è una pressione del tasto () metodo di evento. il numero ASCII del tasto Invio è 13 e non è dipendente su cui viene utilizzato il browser.

Answer 8

Usa event.key e JS moderna!

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

o senza jQuery:

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

Mozilla Docs

Browser supportati

Answer 9

Un'estensione minore della risposta di Andrea sopra rende il metodo di supporto più utile quando si potrebbe anche voler catturare presse modificati entrare (cioè ctrl-entrare o shift-enter). Ad esempio, questa variante permette vincolante come:

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

per inviare un modulo quando l'utente preme ctrl-entrare con particolare attenzione alla textarea di quel modulo.

$.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);
            }
        })
    })
}

(vedi anche Ctrl + Invio jQuery in TEXTAREA )

Answer 10

In alcuni casi, potrebbe essere necessario per sopprimere il INVIO per una certa area di una pagina, ma non per altre aree di una pagina, come la pagina sottostante che contiene un intestazione <div> con un ricerca campo.

Mi c'è voluto un po 'per capire come fare questo, e sto postando questo esempio semplice ma completa qui per la comunità.

<!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 JSFiddle Playground : il pulsante [Submit] non fa nulla, ma premendo INVIO da uno dei controlli casella di testo non inviare il modulo.

Answer 11

Prova questo per rilevare il tasto ENTER.

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

vedi demo @ rilevare entrare premere il tasto sulla tastiera

Answer 12

Usando il metodo pressione di un tasto per rilevare premere Invio sulla tastiera utilizzando jQuery?

https://www.tutsmake.com/ jquery-pressione di un tasto-evento-detect-entrare-key-premuto /

        $('#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

Il modo più semplice per rilevare se l'utente ha premuto entrare è quello di utilizzare il numero tasto inserire il numero chiave è = 13 per controllare il valore della chiave nel dispositivo

$("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);
});

Premendo il tasto si otterrà come risultato 13 entrano. utilizzando il valore chiave che si può chiamare una funzione o fare quello che vuoi

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

se si desidera raggiungere un pulsante una volta entrare tasto viene premuto è possibile utilizzare il codice

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

La speranza è aiutare

Answer 14

Credo che il metodo più semplice sarebbe utilizzando vaniglia 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
    }
});