Event types in Javascript

List of the most common types of events in the Javascript language, along with a description of each one.

Now we are going to see a list of the types of events that are available in Javascript, offering a brief description of each one.

Event types are defined by the Javascript standard and are implemented in browsers. They contain all the notable situations or things that the browser itself will inform you about. We will be able to create event handlers for all these types of events. Logically, depending on the web application you are making and what you want to achieve, you will create handlers for some types of events or others, based on your own criteria or needs.

If we want to know previously what an event is and how they are treated in Javascript, we can consult the previous article in the manual:

Event types in Javascript 1.2

These types of events are the most common, present in Javascript 1.2. There are other types of events that are also very interesting and we will see later in this article.

Each event has a name, for example “click”. In addition, in the HTML code itself we can associate event handlers through attributes, which are used to invoke a series of commands when an event occurs on that element. The attributes that we can use in the HTML to associate event handlers are always prefixed with “on” followed by the name of the event. For example, “onclick”.

Note: The list of event types contains the name of the handler in bold, its description and finally the version of Javascript that incorporated said handler.

abort (onabort)

This event is raised when a user stops loading an image, either by stopping the page from loading or by taking an action that stops the page, such as leaving the page.

javascript 1.1

blur (onblur)

An onblur event is fired when an element loses the focus of the application. The focus of the application is the place where the cursor is located, for example it can be located on a text field, a page, a button or any other element.

javascript 1.0

change (onchange)

This event is fired when the state of a form element changes, sometimes not until the user removes application focus from the element. javascript 1.0

javascript 1.0

click

Occurs when the mouse button is pressed or clicked on an element of the page, usually a button or a link.

javascript 1.0

dragdrop (ondragdrop)

Occurs when a user drops something they had dragged onto the web page.

javascript 1.2

error (onerror)

It occurs when a document or image cannot be loaded and it is broken.

javascript 1.1

focus (onfocus)

The onfocus event is the opposite of onblur. Occurs when a page element or window gains application focus.

javascript 1.0

keydown (onkeydown)

This event occurs the instant a user presses a key, regardless of whether or not they release it. Occurs at the moment of pressing.

javascript 1.2

keypress (onkeypress)

An onkeypress event occurs when the user holds down a key for a certain amount of time. Before this event, an onkeydown occurs at the moment the key is pressed.

javascript 1.2

keyup (onkeyup)

Occurs when the user stops pressing a key. Occurs at the moment the key is released.

javascript 1.2

load(onload)

This event is fired when the page, or in Javascript 1.1 the images, has finished loading.

javascript 1.0

mousedown (onmousedown)

The onmousedown event occurs when the user clicks on an element on the page. onmousedown occurs when the button is pressed, whether it is released or not.

javascript 1.2

mousemove (onmousemove)

Occurs when the mouse moves across the page.

javascript 1.2

mouseout (onmouseout)

An onmuoseout event is fired when the mouse pointer leaves the area occupied by a page element.

javascript 1.1

mouseover (onmouseover)

This event is fired when the mouse pointer enters the area occupied by a page element.

javascript 1.0

mouseup (onmouseup)

This event occurs when the user releases the mouse button, which had previously been pressed.

javascript 1.2

move (onmove)

Event that is executed when the browser window, or a frame, is moved.

javascript 1.2

resize (onresize)

Event that occurs when the browser window is resized, or the frame, if the page has them.

javascript 1.2

reset (onreset)

This event is associated with forms and is triggered when a user clicks the reset button on a form.

javascript 1.1

select(onselect)

Called when a user makes a selection of an element on a form.

javascript 1.0

submit (onsubmit)

Occurs when the visitor clicks on the button to submit the form. It is executed before the actual submission.

javascript 1.0

unload (onunload)

When leaving a page, either by clicking on a link that takes us to another page or by closing the browser window, the onunload event is executed.

javascript 1.0

Event types in Javascript 1.3

So far in the article we have seen the events of Javascript versions 1.0, 1.1 and 1.2, but in this case we are going to present the list of Javascript 1.3 event handlers.

DblClick (ondblclick):

This event is fired when the user double clicks on a form element or a link.

scroll(onscroll):

This event occurs when a scroll is performed. This scrolling can be done on the entire page, but also on page elements that have their own scroll zones.

conclusion

We have known the types of events most used in Javascript. It is just a list of the most important. There are others that are not used as much but that you could consult in the DOM documentation of the specific element that you need to control.

Don’t worry if some knowledge has been left in the air, because we are going to continue doing practices with events in Javascript. For example, in the following article you will see a . The manual is also littered with sample events below.