Application of binding and uncoupling functions in JavaScript _javascript tips

Source: Internet
Author: User
Tags documentation

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:

format of the consortium:

RemoveEventListener (event,function,capture/bubble);

the format of Windows IE is as follows:

DetachEvent (event,function);

Target.addeventlistener (type, listener, usecapture);
Target document 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 whether to use capture, look at the following event flow after a section of the clear, general use false
When an event is triggered, an event object is passed to the events handler, for example:
document.getElementById ("Testtext"). AddEventListener ("KeyDown", function (event) {alert (Event.keycode);, false);
Adapt to the browser version of different, while using the process to pay attention to
Attachevent method button onclick ie using
AddEventListener method button click in Fox
The rationale for the use of the two is that it is not the same as the priority of execution, as the following examples explain:
Attachevent method, attaching additional handling events for an event. (Mozilla series not supported)
AddEventListener Method for Mozilla series
Example: document.getElementById ("btn"). onclick = method1;
document.getElementById ("btn"). onclick = Method2;
document.getElementById ("btn"). onclick = method3; If so, then only the MEDHOT3 will be executed.
Written in this way:
var btn1obj = document.getElementById ("btn1"); Object.attachevent (event,function);
Btn1obj.attachevent ("onclick", method1);
Btn1obj.attachevent ("onclick", method2);
Btn1obj.attachevent ("onclick", method3); execution order is method3->method2->method1
If the Mozilla series, does not support the method, need to use the AddEventListener 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); execution order is method1->method2->method3
Example: (Note that the div must be placed in front of JS before the line)

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.