Home > Developer > JavaScript
Event handling Overview
Event processing is a very important part of object-oriented programming. Without event processing, the program will become very dead and lacks flexibility. The process of event processing can be like this: Event-start event handler-event handler to respond. To enable the event handler to start, you must first tell the object what handler to start if something happens. Otherwise, the process cannot proceed. The event handler can be any JavaScript statement, but we usually use a specific custom function to handle the event.
There are three methods to specify an event handler:
Method 1 is directly specified in the HTML Tag. This method is the most common. The method is:
<Tag... event = "event handler" [event = "event handler"...]>
Let's take a look at the example:
<Body... onload = "alert ('webpage reading is complete, please enjoy it slowly! ') "Onunload =" alert ('Goodbye! ') ">
The <body> mark of this definition can pop up a dialog box when the document is read, saying "please read the webpage slowly." When the user exits the document (or closes the window, or go to another page ".
Method 2: Compile the JavaScript code for a specific object event. This method is rarely used, but it is useful in some scenarios. The method is:
<Script language = "JavaScript" for = "object" event = "event">
...
(Event handler code)
...
</Script>
<Script language = "JavaScript" for = "window" event = "onload">
Alert ('webpage reading is complete. Please enjoy it slowly! ');
</Script>
Method 3 is described in JavaScript. Method:
<Event protagonist-Object>. <event >=< event handler>;
Note that the "event handler" is a real code, not a string code. If the event handler is a custom function, do not add "()" If you do not need to use parameters.
Function ignoreError (){
Return true;
}
Window. onerror = ignoreError; // "()" is not used
In this example, the ignoreError () function is defined as the onerror event handler of the window object. The result is to ignore any errors in the window object (the "no permission" error generated by referencing the location object that is not allowed to be accessed cannot be ignored ).
Event details
The onblur event occurs when the window loses focus. Applied to: window objects
The onchange event occurs when the content in the text input area is changed, and the focus is removed from the text input area. Capturing this event is mainly used to detect the input validity in real time or change the document content immediately. Applies to: Password object; Select object; Text object; Textarea object
The onclick event occurs when the object is clicked. Clicking is a complete process of holding the mouse over the object and pressing the mouse key without moving the mouse. A normal Button object (Button) usually has an onclick event handler, because this kind of object cannot get any information from the user at all, without the onclick event handler is equivalent to the waste of wood. To add an onclick event handler to the button, you can simulate another commit button by modifying one or more attributes of the form, such as action, target, encoding, and method, in the event handler, then, call the submit () method of the form. Return false in The onclick event handler of The Link object to prevent the browser from opening the connection. That is, if there is a connection like this: <a href = "http://www.a.com" onclick = "return false"> Go! </A> the website does not go to www.a.com no matter how you click it, unless the browser is prohibited from running JavaScript. Applies to: Button object, Checkbox object, Image object, Link object, Radio object, Reset object, and Submit object.
Onerror occurs when an error occurs. Its event Handler is usually called an Error Handler to handle errors. As described above, to ignore all errors, use:
Function ignoreError (){
Return true;
}
Window. onerror = ignoreError;
Applied to: window objects
The onfocus event occurs when the window gets the focus. Applied to: window objects
The onload event occurs when all documents are downloaded. After all the files are downloaded, not only HTML files, but also images, plug-ins, controls, applets, and other content are downloaded. This event is a window event, but when you specify an event handler in HTML, we write it in the <body> tag. Applied to: window objects
The onmousedown event occurs when the user places the mouse on the object and presses the mouse key. Refer to the onmouseup event. Applied to: Button object; Link object
The onmouseout event occurs when the mouse leaves the object. Refer to the onmouseover event. Applied to: Link object
The onmouseover event occurs when the mouse enters the object range. This event and the onmouseout event, coupled with pre-reading, can achieve the effect of image changes when the mouse moves over the image connection. Sometimes we can see that when pointing to a connection, the status bar does not display the address, but other information, it seems that the information can be changed at any time. They are made in this way:
<A href = "..." onmouseover = "window. status = 'click Me Please! '; Return true; "onmouseout =" window. status = ''; return true;">
Applied to: Link object
The onmouseup event occurs when the user places the mouse on the object and the mouse key is pressed. This event does not occur if the mouse is not on an object that is opened when you press the mouse key. Applied to: Button object; Link object
The onreset event occurs when the "reset" button of the form is clicked (pressed and released. Return false in the event handler to prevent form resetting. Applied to: Form objects
The onresize event occurs when the window is adjusted. Applied to: window objects
The onsubmit event occurs when the "Submit" button of the form is clicked (pressed and released. You can use this event to verify the validity of the form. Return false in the event handler to prevent form submission. Applied to: Form objects
The onunload Event occurs when the user exits the document (or closes the window, or goes to another page. Like onload, it should be written in HTML and written into the <body> tag. Some Web Masters use this method to pop up the "Investigation Form" and fill it in as "forced"; some pop up the advertisement window, prompting the visitors to click the connection. I think this method of "onunload =" open... "is very bad. Sometimes, too many windows are displayed, leading to lack of resources. What do you say to the recipient should be done on the webpage? Applied to: window objects
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
