Events in JavaScript are described as on of the two possible principles, that is the event bubbling principle and the event capturing principle. Events are generally handled by event listening and handling methods, and via the Event object. Furthermore events are grouped together by the type of action performed, such as mouse events, keyboard events, etc... They are listed in below tables.
Event types and actions
TYPE |
ACTION |
DESCRIPTION |
---|
clipboard events |
oncopy, oncut, onpaste |
HTML, DOM |
composition events |
compositionend, compositionstart, compositionupdate |
DOM3 |
focus events |
onblur, onfocus, onfocusin, onfocusout. |
DOM3 |
form events |
onblur, onchange, onfocus, onfocusin, onfocusout, onsubmit, onreset |
HTML, DOM |
keyboard events |
onkeydown, onkeypress, onkeyup |
HTML, DOM, DOM3 |
mouse events |
onclick, oncontextmenu, ondblclick, onmouseenter, onmouseexit, onmousedown, onmouseleave, onmousemove, onmouseup, onmouseout, onmouseover |
HTML, DOM, DOM3 |
print events |
onafterprint, onbeforeprint |
DOM3 |
text events |
data, inputMethod, textInput |
DOM3 |
user interface events |
onabort, onerror, onload, onscroll, onselect, onresize, onunload |
DOM3 |
wheel events |
deltaMode, deltaX, deltaY, deltaZ, onmousewheel |
HTML, DOM3 |
window and frame events |
DOMContentLoaded, onabort, onbeforeunload, onerror, onhashchange, onload, onpagehide, onpageshow, onresize, onscroll, onunload |
HTML, DOM, DOM2 |
Events general methods
METHOD |
DESCRIPTION |
---|
addEventListener() |
Adds an event listener to a given element. |
attachEvent() |
Attaches an event to an existing event handler function. |
detachEvent() |
Detaches an event to an existing event handler function. |
removeEventListener() |
Removes an event listener (handler) from a given element. |
NAME |
DEFINTION |
DESCRIPTION |
---|
bubbles |
property |
Event bubbles. |
cancelable |
property |
Event can be canceled. |
currentTarget |
property |
Node (element) target for the event. |
defaultPrevented |
property |
Checks if default is canceled. |
detail |
property |
Information about the event. |
eventPhase |
property |
Checks the phase. |
preventdefault() |
method |
Cancels all default behaviour. |
stopImmediatePropagation() |
method |
Cancels further event propagation and stops other event handlers from being called. |
stopPropagation() |
method |
Cancels further event propagation. |
target |
property |
Event's target. |
trusted |
property |
Event was created with JavaScript. |
type |
property |
Type of event fired. |
PROPERTY |
DESCRIPTION |
---|
button |
Returns the value with mouse button that was pressed. |
buttons |
Returns the mouse buttons that were pressed (if more then one was pressed). |
which |
Returns the value with mouse button that was pressed with increment of one. |
PROPERTY |
DESCRIPTION |
---|
altkey |
Returns true if ALT key is pressed. |
charcode |
Returns an ASCII character in a form of a number of the pressed key. |
ctrlkey |
Returns true if CTRL key. |
key |
Returns the key value of the pressed key. |
keycode |
Returns an Unicode character of the pressed key. |
location |
Returns the location of the pressed key. |
metakey |
Returns true if the ‘meta’ key in Windows or a ‘cmd’ key in Mac are pressed. |
shiftkey |
Returns true if a ‘shift’ key is pressed. |
which |
Returns a Unicode character code of the key which triggered the onkeypress event. |
Retrieving character back from keycode or charcode property can be also done by using fromCharCode() function.
Comments
No comments have been made yet.
Please login to leave a comment. Login now