(Note that Div must be placed in front of JS to the line)
In general, if you bind a DOM object to the same event, only the last one will take effect, such as:
Copy Code code as follows:
document.getElementById ("btn"). onclick = method1;
document.getElementById ("btn"). onclick = Method2;
document.getElementById ("btn"). onclick = method3;
Then only method3 will take effect.
In the case of the Mozilla series, AddEventListener can allow multiple events to be implemented sequentially, such as:
Copy Code code as follows:
var btn1obj = document.getElementById ("btn1");
Element.addeventlistener (type,listener,usecapture);
Btn1obj.addeventlistener ("click", Method1,false);
Btn1obj.addeventlistener ("click", Method2,false);
Btn1obj.addeventlistener ("click", Method3,false);
The order of execution is method1->method2->method3
If it is an IE series, use attachevent to enable multiple events to be implemented sequentially, such as:
Copy Code code as follows:
var btn1obj = document.getElementById ("btn1");
Object.attachevent (event,function);
Btn1obj.attachevent ("onclick", method1);
Btn1obj.attachevent ("onclick", method2);
Btn1obj.attachevent ("onclick", method3);
The order of execution is method3->method2->method1
=======================================================
In Mozilla:
How to use AddEventListener
Target.addeventlistener (type,listener,usecapture);
Target: Documentation node, document, window, or XMLHttpRequest.
Type: String, event name, excluding "on", such as "click", "MouseOver", "KeyDown", and so on.
Listener: Implements a EventListener interface or a function in JavaScript.
Usecapture: Use capture, generally false. For example: document.getElementById ("Testtext"). AddEventListener ("KeyDown", function (event) {alert (event.keycode);}, False );
In IE:
Target.attachevent (type, listener);
Target: Documentation node, document, window, or XMLHttpRequest.
Type: String, event name, including "on", such as "onclick", "onmouseover", "onkeydown", and so on.
Listener: Implements a EventListener interface or a function in JavaScript. For example: document.getElementById ("TXT"). attachevent ("onclick", function (event) {alert (event.keycode);});
Both the consortium and IE support the removal of the specified event, which is used to remove the set event, in the following format:
RemoveEventListener (event,function,capture/bubble);
The format of Windows IE is as follows:
DetachEvent (event,function);
The evolution of DOM2:
| DOM 0 Event |
DOM 2 Event |
| Onblur () |
Blur |
| Onfocus () |
Focus |
| OnChange () |
Change |
| onMouseOver () |
MouseOver |
| onMouseOut () |
Mouseout |
| OnMouseMove () |
MouseMove |
| OnMouseDown () |
MouseDown |
| OnMouseUp () |
MouseUp |
| OnClick () |
Click |
| OnDblClick () |
DblClick |
| OnKeyDown () |
KeyDown |
| OnKeyUp () |
KeyUp |
| onkeypress () |
KeyPress |
| OnSubmit () |
Submit |
| OnLoad () |
Load |
| OnUnload () |
Unload |
The new DOM2 usage can be observed by AddEventListener () This function:
Copy Code code as follows:
AddEventListener (event,function,capture/bubble);
Parameter event as shown in the previous table, the function is the functions to execute, capture and bubble are two time patterns that are developed by the world's business, and simply capture is read from the beginning of the document to the last line, then execute the event, Bubble, however, looks for the specified location before executing the event.
The Capture/bubble argument is a Boolean value, and true means capture, False is Bubble.windows Internet Explorer also has a EventHandler, is attachevent (), The format is as follows:
Copy Code code as follows:
Window.attachevent ("Submit", MyFunction ());
In particular, attachevent does not need to specify capture/bubble parameters, because the bubble mode is used in Windows IE environments.
How can I tell if I support what kind of listening? Such as:
Copy Code code as follows:
if (typeof Window.addeventlistener!= "undefined") {
Window.addeventlistener ("Load", rollover,false);
} else {
Window.attachevent ("onload", rollover)
}
The above typeof Window.addeventlistener!= "undefined" program code can determine whether the user's browser supports AddEventListener this event model and use Attachevent if not supported.
Both the consortium and IE support the removal of the specified event, which is used to remove the set event, in the following format:
Format of the Consortium:
RemoveEventListener (event,function,capture/bubble);
The format of Windows IE is as follows:
DetachEvent (event,function);
