JQuery 'keypress' does not work for some keys in Chrome. How to work?

Question

I am trying to implement a keystroke function that removes a div when the user presses Esc . This works for Firefox and IE with the following code:

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

If I press any key, the first alert displayed, and if I delete the Escape, the second alert displayed.

However, this does not work with Chrome. The first alert always displayed if I press any of the letter keys, but not when I press Escape, Tab, Space or any of the numbers.

Why was that? Is there a way to get Chrome to respond to these keystrokes?

Answer 1

Try using keydown .

Answer 2

use keydown . keypress does not 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 3

For the ESC key:

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

For letter keys such as "L":

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

Works in both Chrome and Firefox

Answer 4

After the second warning, add also

 e.preventDefault(); 

This will prevent the default event action from being triggered.

Read more 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 5

Using the jquery.hotkey js file, you can make the "Sort" button

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