Original source: http://blog.163.com/m13864039250_1/blog/static/21386524820144155526737/
There are three parameters for AddEventListener, and the syntax is:
Element.addeventlistener (Type,listener,usecapture)
Here's a detailed explanation of which element is the object to bind the function to. Type is the event name, note that "onclick" is changed to "click", "onblur" to "blur", which means that the event name does not have "on". Listener is, of course, the binding function, remember not to follow the parentheses the last argument is a Boolean value that represents the order of response for the event, and the 3rd argument (usecapture) of the AddEventListener is highlighted below.
If Usercapture is true, the browser uses the capture, or false to the Bubbing method. It is recommended to use false to see an example. (bubble with capture specific reference here). Compatibility judgment and simple Event registration instance:
AddEventListener is not supported for IE browsers
if (Window.addeventlistener) {
Alert ("Support AddEventListener");
} else {
Alert ("Does not support AddEventListener");
}
Attachevent is not supported for Google browsers
if (window.attachevent) {
Alert ("Support attachevent");
} else {
Alert ("Does not support attachevent");
}
IE Registration OnLoad event (first registered after the trigger)
Window.attachevent ("onload", Funcone);
Window.attachevent ("onload", functwo);
Google Browser Registration onload event (first to be registered first trigger)
Window.addeventlistener (' Load ', Funcone, false);
Window.addeventlistener (' Load ', Functwo, false);
function Funcone () {
Alert ("Funcone");
}
function Functwo () {
Alert ("Functwo");
2. Event queue registration and cancellation:
<script type= "Text/javascript" >
Window.onload = function () {
var btnone = document.getElementById ("Btnone");
IE registration after the event, first registered after the trigger
Btnone.attachevent ("onclick", funcone);
Btnone.attachevent ("onclick", functwo);
Register event under Goole (first sign up first)
Btnone.addeventlistener (' Click ', Funcone, false);
Btnone.addeventlistener (' Click ', Functwo, false);
}
function Revmoeclick () {
var btnone = document.getElementById ("Btnone");
Cancel registration under IE
Btnone.detachevent ("onclick", funcone);
Btnone.detachevent ("onclick", functwo);
Unregister events under Goole
Btnone.removeeventlistener (' Click ', Funcone, false);
Btnone.removeeventlistener (' Click ', Functwo, false);
}
function Funcone () {
Alert ("Funcone");
}
function Functwo () {
Alert ("Functwo");
}
</script>
<body>
<input type= "button" id= "Btntwo" value= "unregister event" onclick= "Revmoeclick ()"/>
<input type= "button" id= "Btnone" value= "event button"/>
</body>
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
