The events presented here have names that are recognized by most browsers when they occur on a specific HTML element. That is, the browser will look for the event handler script you registered for this HTML element, and it will be executed immediately.
There are only a few events in the beginning. These events work in almost all JavaScript browsers, even very old ones. Note that those early events only work on links or forms, and sometimes on the entire window, but not most other HTML elements.
Times have changed, and many new events have been introduced to you. Fourth generation browsers and higher allow events to be registered on any HTML element.
So you can basically bind any event on any element, although binding a keydown on
doesn’t make much sense.
See the full browser event compatibility list here.
Interface events
Interface events are not triggered by user actions, but by the results of user actions.
When the user clicks on any element, a click time will be triggered. When a click occurs on an element with special meaning, additional interface events will be triggered.
For example, when the user clicks on a link, the click time is triggered. Click this link and a new page will be loaded, so this special click event causes the interface event unload to be triggered.
Other interface events include resize, scroll and focus/blur.
Mouse events
Starting from Netscape 2, all browsers have noticed these two facts. When the mouse enters a link area, the mouseover event is triggered. When he clicks on this link, the click event is triggered. Soon after mouseout was added, it will be triggered when the mouse leaves the link area. Therefore the Traditional Mouse Event Triad (Traditional Triad) was established.
The third generation of browsers has made some extensions to mouse events. dbclick has been added, and the click event is divided into mousedown and mouseup: the user presses and pops up the mouse button. Finally, mousemove tracking the trajectory of the mouse
has also become possible
In the following chapters, mouse events will be explained in detail.
Form events
Forms can recognize submit and reset events. Submit is triggered when the user submits the form. Reset is triggered when the form is reset. The submit event is the core of all form validation code. When the user submits the form, the form is traversed to check for incorrect data. If an error is found, stop submitting the form and issue a warning to the user.
The form can also identify focus and blur events, as well as keyboard events and click events when an item gains or loses focus. Additional compatibility lists can be viewed.
Generally be careful when using these events. It's entirely possible to use onblur to validate data when the user navigates away from an item in a form, but this is often annoying. Users don’t want to see any pop-up prompts when they are busy filling out a form.
W3C events
In W3C’s
DOM 2 event specification also defines some Mutation events. These events are triggered when the document's DOM structure changes. The most common one is the DOMSubtreeModified event, which is triggered when the DOM changes.
Mozilla sets this event to subtreemodified. Mozilla also does not support other w3c events that we have not mentioned.
Microsoft events
Microsoft has created a lot of events. Some are very interesting.
The comtextmenu event will be triggered when the user clicks the right mouse button at any time. This is useful enough to abuse. Mozilla also supports this event.
When an XML file is imported, the readystatechange event is served like some load events. When the readyState of the XML document becomes 4, the document is loaded. (Don’t ask me what readyState is, it works and is enough)
What is surprising is that there is a beforeunload event before the unload event occurs. It was designed to cancel closing the page, but no one cared.
Finally, Microsoft also invented the mouseenter and mouseleave events, which are almost the same as the mouseover and mouseout events.See chapter Mouse Events.
Of course the above events are only supported by IE.
Mozilla events
Mozilla, of course, also has
a lot of its own events. I haven't studied it carefully yet.
Event handler
All events will be detected by the browser whenever they are triggered. Browsers also typically execute default procedures, such as when a user clicks on a link. But sometimes nothing happens.
The whole point of event handlers is that you can make other things happen. You can have the browser execute your script when an event occurs. If you write it like this then your script will be executed whenever the event occurs. If these scripts are useful on a logical basis, your users will be very happy.
In order to ensure that your script can be executed when the event is triggered, you need to register the event for a certain action of the HTML element, like the following:
这样脚本里的alert('I\'ve been clicked!')就会在click事件发生的时候执行。这就注册了一个事件处理程序。<br>
Continue
If you want to continue learning, please read the next chapter.