[SoftServe IT Academy] - JavaScript Events

JavaScript

Events

Ivan Matiishyn

January, 2014

Agenda

▪ Types of Events

▪ Registering Event Handlers

▪ Event Handler Argument

▪ Event Cancellation

▪ Bubbling

▪ Capturing

▪ References and sources

Types of Events

▪ onclick

▪ onmousedown, onmouseup,

▪ onmousemove, onmouseover,

onmouseout

<body>, <input>, <textarea>

▪ onkeydown

▪ onkeypress

▪ onkeyup

Types of Events

▪ onfocus, onblur

▪ onload, onunload, onresize

<form>, elements

▪ onreset, onsubmit

▪ onselect, onchange, onscroll

▪ HTML5 Events, Touchscreen

Registering Event Handlers - Base Model

Setting Event Handler Attributes▪ Using

▪ Cancel


Setting Event Handler Attributes

▪ this


Setting Event Handler Properties

▪ Using

Registering Event Handlers

W3C DOM - IE

▪ W3C DOM

▪ IE

Registering Event Handlers

Cross Browser Event Handlers

Event Handler Argument

▪ Any source– type

– targer / srcElement

▪ Mouse– button

– altKey, ctrlKey, shiftKey

– clientX, clientY

▪ Keyboard– keyCode

Event Cancellation

▪ W3C DOM

▪ IE

▪ Cross Browser

Bubbling

▪ After an event triggers on the deepest possible element, it then triggers on parents in nesting order.

Capturing

▪ Captures down - through 1 -> 2 -> 3.

▪ Bubbles up - through 3 -> 2 -> 1.

References and sources

1. javascript.info2. JavaScript: The Definitive Guide, 6th Edition3. Everyone’s experience

http://javascript.info/tutorial/introduction-browser-events

Questions?

Internet

[SoftServe IT Academy] - JavaScript Events