jQuery's 'keypress' doesn't work f

Question

I'm trying to implement key-press functionality which will remove a div when the user hits Esc. This works for Firefox & IE with the following code:

$("body").keypress(function(e) {
    alert("any key pressed");
    if (e.keyCode == 27) {
        alert("escape pressed");
    }
});

If I hit any key, the first alert is displayed, and if I hit Escape, the second alert is also displayed.

This doesn't work with Chrome though. The first alert is always displayed if I hit any of the letter keys, but not when I hit Escape, Tab, Space or any of the numbers.

Why would this be? Is there any way to get Chrome to respond to these key presses?

Answer 1

keypress 'ESC'

e.which: 0
e.keyCode: 27

keyup 'ESC'

e.which: 27
e.keyCode: 27

---

For non-printable characters better use keyup.

Answer 2

After the second alert add also

e.preventDefault();

This will prevent the default action of the event to be triggered.

More info about this method here

Your code should look like

$("body").keypress(function(e) {
    alert("any key pressed");
    if (e.keyCode == 27) {
         alert("escape pressed");
         e.preventDefault();
}});

Answer 3

Using Jquery.hotkey js file you can Make Sortcut key

$(document).bind('keydown', 'esc', function(){ });

Answer 4

Try handling keydown instead.

Answer 5

use keydown. keypress doesn't work with ESC in Chrome (not sure about other browsers).

$(newTag).keydown(function(e) {  //keypress did not work with ESC;
    if (event.which == '13') {
      ProfilePage.saveNewTag(search_id, $(newTag).val());
    }
    else if (window.event.which){
      $(newTag).remove();
    }
}); 

Answer 6

For ESC key:

$(document).keydown(function(e) {
  if(e.keyCode == 27) { /* Run code */ }
}

For letter keys, like 'L':

$(document).keypress(function(e) {
  if(e.which == 108) { }
});

Works in both Chrome and Firefox