jQuery in Action
The jQuery Event Model
105
Importantly, the
keypress
property isn't reliable cross-browser for non-alphabetic
characters. For instance, the left arrow key has a code of 37, which works reliably
on keyup and keydown events. Safari returns nonstandard results for these keys
on a keypress event.
on keyup and keydown events. Safari returns nonstandard results for these keys
on a keypress event.
We can get a reliable, case-sensitive character code in the
which
property
of keypress events. During keyup and keydown events, we can only get a case-
insensitive key code (so a and A both return 65), but we can determine case by
checking
insensitive key code (so a and A both return 65), but we can determine case by
checking
shiftKey
.
The
Event
instance contains not only properties that give us information
regarding the event that's handled, but also possesses a handful of methods that
lets us control the propagation of the event. Let's dig into those.
lets us control the propagation of the event. Let's dig into those.
metaKey
Set to true if the Meta key was pressed when the event was triggered, false if not.
The Meta key is the Ctrl key on PCs and the Command key on Macs.
The Meta key is the Ctrl key on PCs and the Command key on Macs.
pageX
For mouse events, specifies the horizontal coordinate of the event relative from the
page origin.
page origin.
pageY
For mouse events, specifies the vertical coordinate of the event relative from the page
origin.
origin.
relatedTarget
For some mouse events, identifies the element that the cursor left or entered when
the event was triggered.
the event was triggered.
screenX
For mouse events, specifies the horizontal coordinate of the event relative from the
screen origin.
screen origin.
screenY
For mouse events, specifies the vertical coordinate of the event relative from the
screen origin.
screen origin.
shiftKey
Set to true if the Shift key was pressed when the event was triggered, false if not.
target
Identifies the element for which the event was triggered.
type
For all events, specifies the type of event that was triggered (for example, click). This
can be useful if you're using one event handler function for multiple events.
can be useful if you're using one event handler function for multiple events.
which
For keyboard events, specifies the numeric code for the key that caused the event,
and for mouse events, specifies which button was pressed (1 for left, 2 for middle, 3
for right). This should be used instead of button, which can't be relied on to function
consistently across browsers.
and for mouse events, specifies which button was pressed (1 for left, 2 for middle, 3
for right). This should be used instead of button, which can't be relied on to function
consistently across browsers.
Table 4.1 Safe
Event
instance properties (continued)
Property
Description