KEYBOA
KEYBOADDDEVENTS
KEYBOA EVENTS
EVENTS
CHEATSH
CHEATSHEET
CHEATSH EET
EET
1. Keydown Event
The keydown event triggers when any key is pressed. It's useful
for detecting both character and non-character keys, such as
arrow keys or function keys.
2. KeyUp Event
The keyup event triggers when a key is released after
being pressed. It helps in capturing the key that was
released.
3. Keypress (Deprecated)
The keypress event fires when a key that produces a character
is pressed. This event is deprecated and replaced by keydown
for broader compatibility. keys.
Key Differences
Keydown: Captures any key, including non-
character keys (e.g., Shift, Ctrl, etc.)
Keyup: Useful for detecting key release.
Keypress: Only captures keys that produce a
character value (e.g., letters, numbers,
punctuation). It is deprecated in favor of
keydown and keyup.
Common Properties of
the event Object
event.key Returns the value of the key pressed as
a string
Returns the physical key on the keyboard that
event.code
was pressed, represented as a string
Returns true if the Control (Ctrl) key was
event.ctrlKey pressed during the event. value of the key
pressed as a string
Returns true if the Meta key (Command key
event.metaKey on Mac, Windows key on Windows) was
pressed during the event.
event.altKey Returns true if the Alt key was pressed
during the event.
Returns true if the Shift key was pressed
event.shiftKey
during the event
Summary
event.key: Actual key pressed.
event.code: Physical key code.
event.shiftKey,event.ctrlKey,event.altKey,
event.metaKey: Are Boolean values
indicating if modifier keys (Shift, Ctrl, Alt,
Meta) were held during the event.
Keep in mind that various browsers may handle
keyboard events slightly differently, so it's crucial to test
your development across multiple browsers.
If you find this helpful don't
forget to share and also join
us for more
@mrsmartchoice
@eldnight
