Using jQuery to listen to keydown event

Question

I want to detect when the enter key is pressed, on HTML that will be injected dynamically.

To simply detect when the enter key is pressed, I can do:

$('#textfield').keydown(function (e){ if(e.keyCode == 13){ console.log('Enter was pressed'); } })

This code works for on(), but I am worried it is inefficient since jQuery will check every time a key is pressed. Is there anything inefficient about this?

$('body').on('keydown','#textfield', function(event) { if (event.keyCode == 13) { console.log('Enter was pressed'); } }

No. Literally thousands of things happen when a key is pressed, it'll be like a drop in the ocean. — JJJ
– JJJ, Commented Feb 17, 2013 at 8:59

Aidan Ewen · Accepted Answer · 2013-02-17 09:02:49Z

63

If you want to capture the keypress anywhere on the page -

$(document).keypress(function(e) { if(e.which == 13) { // enter pressed } });

Don't worry about the fact this checks for every keypress, it really isn't putting any significant load on the browser.

answered Feb 17, 2013 at 9:02

Aidan Ewen

13.4k11 gold badges69 silver badges92 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

M H Over a year ago

buy why is someone typing into a hidden field? @DCdaz

user4563161 Over a year ago

A field that has been hidden or injected and shown again after Dom.

Gavin Anderegg · Accepted Answer · 2016-08-12 13:26:15Z

You could still use .on()

$(document).off('keyup#textfield'); $(document).on('keyup#textfield', function(event) { if (event.keyCode == 13) { console.log('Enter was pressed'); } });

Plynx · Accepted Answer · 2013-02-17 08:59:04Z

In practical terms, nothing you have to worry about. The browser is already going to be bubbling that event, and even though it may be trapped by the body and run a selector from the delegated event, this is not a deep or difficult practical check for JQuery to perform, especially with an ID-only selector.

Agree. BTW: You don't really have a choice - theres no way to add a listener to key (although it would be nice).
...and even if there were a way to add a listener to a single key, internally the browser would still have to react to every keypress to determine which key was pressed.

Collectives™ on Stack Overflow

Using jQuery to listen to keydown event

3 Answers 3

2 Comments

Comments

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

2 Comments

Linked

Related