Shulou(Shulou.com)06/02 Report--

This article introduces the knowledge of "how to use JavaScript event types". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

In JavaScript, the event type refers to the way the event is triggered, which is simply understood as what event is triggered; event types are: UI event, focus event, mouse and wheel event, keyboard and text event, compound event, change event, HTML5 event, device event, touch and gesture event and so on.

The operating environment of this tutorial: windows7 system, javascript1.8.5 version, Dell G3 computer.

An event refers to a behavior that can be detected by JavaScript and is a trigger-response mechanism. These behaviors refer to the specific actions such as page loading, mouse click / double click, mouse pointer sliding and so on, which play a very important role in realizing the interactive effect of the page.

Event is composed of event source, event type and event handler, which is also called "three elements of event".

Event source: the element that triggers (is) the event

Event type: how the event is triggered (for example, mouse click or keyboard click)

Event handler: code to be executed after the event is triggered (in the form of a function)

The above three elements can be simply understood as "who triggered the event", "what event triggered" and "what to do after triggering the event".

There are many types of events that can occur in Web browsers. Here I will focus on the following common event types:

UI event

Focus event

Mouse and wheel event

Keyboard and text events

Compound event

Change event

HTML5 event

Device event

Touch and gesture events

Part I: UI event

The UI in the UI event is (User Interface, user interface), which is triggered when the user interacts with the elements of the page sauna.

UI events mainly include load,unload,abort,error,select,resize,scroll events.

1.load event

This event triggers the load event on window when the page is fully loaded (including all external resources such as images, js files, css files, and so on).

This event is the most common event in JavaScript. For example, we often use _ window.onload=function () {}; that is, the function is executed when the page is fully loaded.

In addition, it was never known that this event could also be used on other elements, such as image elements, as follows:

3.resize event

The resize event is triggered when the browser's window is adjusted to a new width or height. This event is triggered on the window. So the handler can also be specified through the onresize attribute in the JS or body element.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.