Wednesday, February 19, 2020

Events in JavaScript

Events in JavaScript

Events are actions occurring in a system. These events happening a web page can be detected by javascript and some actions can be taken on the basis of these events.

For example, you click on some button on a web page, and some events like text change, some alert, some UI changes may occur in the response to the event(button click).

There are several events that can happen to a web page like,
  • Clicking the mouse over any element on the web page 
  • Hovering the cursor over any element on the web page.
  • Key button pressed
  • Input field changed
  • Browser window resizing
  • Browser window closing
  • A web page load completed
  • A form being submission
  • Video events like play, or pause, or finish.
  • Error occurrence

Event Handlers

An event handler can be added to an event, means you can do something on the happening of an event. An event handler is a block of code(generally a function) that is executed upon the occurrence of an event. When some code is written in response to the event, this is also known as registering the event handler. However, the events occurring inside the browser are not part of JavaScript, but they are part of the Browser's API.

<some_element event='JavaScript code to execute'>

Some common events are
Event Description
onchange An HTML element has been changed
onclick The user clicks an HTML element
onmouseover The user moves the mouse over an HTML element
onmouseout The user moves the mouse away from an HTML element
onkeydown The user pushes a keyboard key
onload The browser has finished loading the page

For example