Listening and Responding to Events - HTML5 APPLICATIONS DEVELOPMENT MANUAL (2016)

HTML5 APPLICATIONS DEVELOPMENT MANUAL (2016)

25 - Listening and Responding to Events

Events in Programming

Events are actions that a user takes. JavaScript features event handlers, which respond to specific user events.

For example, the onClick event handler responds to clicks on screen. Event handlers respond by executing functions.

Examples of HTML events:

- When a user clicks the mouse

- When a web page has loaded

- When an image has been loaded

- When the mouse moves over an element

- When an input field is changed

- When an HTML form is submitted

- When a user strokes a key

onsubmit

form submission

onkeydown

keystrokes

onkeypress

onkeyup

onclick

mouse or touchpad clicks

onmousedown

onmouseup

onload

page loading/unloading

onunload

onselect

item selection

<!DOCTYPE html>

<html>

<head>

<title></title>

</head>

<body>

<p>Select some of the text:<input type="text" value="Hello, World!" onselect="myFunction()"></p>

<p id="demo"></p>

<script>

function myFunction() {

document.getElementById('demo').innerHTML = "Selecting text is awesome!";

}

</script>

</body>

</html>