JS event handler function between the object is congruent _javascript skill

Source: Internet
Author: User
This little problem has been encountered before, but not to summarize
Now again, in order to get an accurate conclusion, write down:
If the event object is congruent between multiple execution functions of the same incident

For example:
Copy Code code as follows:

Dom.addevent (' click ', FNA);
Dom.addevent (' click ', FNB);

1: The attribute added to the event object in Fna, in the FNB function that is subsequently executed, is the event object accessible?
2: Is the event object when executing the FNA/FNB function congruent EVENTFNA===EVENTFNB?

The standard document is too long where is the rule here? Lazy Bar ...

For jquery, the event object between multiple execution functions is congruent.
In the implementation of the Jquery live binding event, the function Livehandler that may be executed repeatedly relies on the Livefired property of the event object, which exits the function at the start of the Livehandler executed after the first time:
Copy Code code as follows:

if (event.livefired = = This | | ...) {
Return
}
///....
event.livefired = this;

Test:
Copy Code code as follows:

function A (e) {
E.ABC = function () {
alert (a);
};
Prevevent = e;
Previeevent=window.event;
}
Function B (e,event) {
E.ABC (); Fn
Alert (E = = prevevent); True
if (event=window.event) {
alert (event===e); False
alert (event===previeevent);//false
alert (event===prevevent);//false
}
}
var t = document.getElementById ("P");
if (T.addeventlistener) {
T.addeventlistener (' Click ', A, false);
T.addeventlistener (' Click ', B, false)
} else {
T.attachevent (' onclick ', b);
T.attachevent (' onclick ', a)
}

For native binding event mode [Addeventlistener,attachevent], the event object (passed by argument) is congruent between multiple execution functions, in IE, Event objects obtained by window.event form are not congruent. The event passed by the parameter is also not congruent.
For bubbling events:
Copy Code code as follows:

Dom.addevent (' click ', FNA);
Domparentnode.addevent (' click ', FNB);

In jquery, the event object in the function between bubbling events is congruent when triggering events in trigger form. Events that are triggered by the actual user behavior are not the same object. Custom attributes are not passed. None of the value settings affect the real originalevent.
In native binding event [Addeventlistener,attachevent]:
Copy Code code as follows:

function A (e) {
E.ABC = function () {
alert (a);
};
Prevevent = e;
Previeevent=window.event;
}
Function B (e,event) {
alert (E.ABC); Fn
Alert (E = = prevevent); True
if (event=window.event) {
alert (event===e); False
alert (event===previeevent);//false
alert (event===prevevent);//false
}
}
var t = document.getElementById ("P");
if (T.addeventlistener) {
T.addeventlistener (' Click ', A, false);
Document.body.addEventListener (' Click ', B, false);
} else {
T.attachevent (' onclick ', a);
Document.body.attachEvent (' onclick ', b);
}

The result is that the event object in the function between bubble events in IE is inconsistent with the attachevent binding event. FF, etc., are congruent objects with AddEventListener.
In fact, in the case of non ie, the event object is congruent between the handler functions between the propagation of the events objects, or multiple functions that are triggered by the DOM node. is independent of the binding form [Addeventlistener/dom0].
In IE, event objects (attachevent) passed by parameters only with multiple functions triggered by a DOM node are congruent.

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.