Как обнаружить нажатие Enter на клавиатуре с помощью jQuery?

Question

Я хотел бы определить, нажал ли пользователь Введите с помощью jQuery.

Как это возможно? Требуется ли плагин?

РЕДАКТИРОВАТЬ: Похоже, мне нужно использовать метод keypress().

Я хотел бы знать, если кто-нибудь знает, есть ли проблемы с браузером с этой командой - например, есть ли какие-либо проблемы совместимости браузера, о которых я должен знать?

Answer 1

Весь смысл jQuery в том, что вам не нужно беспокоиться о различиях в браузерах. Я уверен, что вы можете смело идти с enter , равным 13 во всех браузерах. Имея это в виду, вы можете сделать это:

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

Answer 2

Я написал небольшой плагин, чтобы упростить привязку события «при нажатии клавиши ввода»:

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

Использование:

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

Answer 3

Я не смог заставить работать код, выложенный @Paolo Bergantino, но когда я изменил его на $(document) и e.which вместо e.keyCode, я обнаружил, что он работает без сбоев.

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

Ссылка на пример в JS Bin

Answer 4

Я обнаружил, что это более совместимо с браузерами:

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

Answer 5

Вы можете сделать это с помощью дескриптора события jquery 'keydown'

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

Answer 6

Я провел некоторое время, придумывая это решение, надеюсь, оно кому-нибудь поможет.

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

Используйте event.key и современные JS!

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

или без jQuery:

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

Документы Mozilla

Поддерживаемые браузеры

Answer 8

Существует метод события keypress () . Номер ascii клавиши Enter равен 13 и не зависит от того, какой браузер используется.

Answer 9

Незначительное расширение ответа Андреа, приведенного выше, делает вспомогательный метод более полезным, когда вам также может потребоваться ввод измененных нажатий на клавишу ввода (т.е. ctrl-enter или shift-enter). Например, этот вариант позволяет связывать как:

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

для отправки формы, когда пользователь нажимает Ctrl-Enter с фокусом на текстовой области этой формы.

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

(см. Также Ctrl + Enter jQuery в TEXTAREA )

Answer 10

Попробуйте, чтобы обнаружить нажатие клавиши Enter.

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

См. Демонстрацию @ обнаружение нажатия клавиши ввода на клавиатуре