How to catch .keypress() on body using jQuery?
January 14, 2021



keypress() binds an event handler to the “keypress” event. It can also trigger that event on any element.

When the browser records keyboard input, the keypress event is sent to an element.

It is similar to the keydown event, except that some keys like modifier and non-printing keys (Shift, Esc, delete) trigger keydown events but they cannot trigger keypress events.

We can attach keypress event handler to any element, but the event is only sent to the element with focus.

All browsers use different properties to store this information. So, jQuery normalizes the .which property so we can reliably use it to retrieve the character code.

While keydown and keyup provide a code that indicates which key is pressed, the keypress provides info on which character was entered.

For example, keydown and keyup indicates 65 when we press a lowercase “a”, but keypress will indicate it as 97.

Interestingly, all events reports 65 for an uppercase “A”.

That’s why .keydown() or .keyup() is a better choice when catching special keystrokes such as arrow keys, .

Learn more about it on Official Docs.


Leave a Reply

Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 How to set opacity or transparency using CSS? #3 Pagination in CSS with multiple examples #4 How to make HTML form interactive and using CSS? #5 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #6 How to uninstall Cocoapods from the Mac OS?

Recently Posted

Mar 3 How to embed YouTube or other video links in WordPress? Mar 3 How to change the Login Logo in WordPress? Mar 3 substring() Method in JavaScript Mar 3 Window setInterval() Method in JavaScript Mar 2 How to zoom an element on hover using CSS? Mar 2 the box-sizing property in CSS

You might also like these

Observation of Human Behavior [Shopping Observation Example]MiscCustom Post Type Template Files in WordPressWordPressThe simple difference between var, let and const in JavascriptJavaScriptHow to Write Complex Search Queries in SQL?SQL/MySQLCan we execute conditions in SQL?SQL/MySQL3 Common Usability Mistakes In Web DesignUI/UXIf statement shorthand examples in JavaScriptJavaScriptWhat is Hoisting in JavaScript?JavaScriptHow to get previous days or next days in PHP?PHPHow to use GROUPING SETS to boost GROUP BY queries in Postgres?PostgresFile System Integrity: How to Keep an Eye on Your Files and Folder Change?MiscDISTINCT ON: The confusing, unique and useful feature in PostgresPostgres