Comments on: Event Handling versus Event Delegation

By: Steve Bush

Steve Bush — Fri, 25 Jul 2008 07:25:53 +0000

This should be called “The benefits of using Event Bubbling” and not have a new obscure term Event Delegation invented for it.

By: Diego Perini

Diego Perini — Wed, 16 Jan 2008 22:28:23 +0000

Christian,
this is the most well written description of Event Delegation, my congrats, info on this is scarce.

I used it so much that I should make my own scripts to handle that with selectors. I can actually handle also the “focus” and “blur” events cross-browser by implementing a small trick in the handling/fixing of events.

You can see my work on delegates here:

http://javascript.nwbox.com/NWEvents/

Look under Delegates to see the only example specific to this method bound to CSS3 Selectors.
Though my syntax is not that short compared to jQuery or similar, I think the idea is unique.

I was searching for “delegates” related to “onload” problems but was not able to find anywhere talking about the fact that “Event Delegation” can lead to avoid having to resort to “onload” or similar method to attach functionality to the page at initial startup.

You seem to have a deep knowledge of these techniques, I would like your suggestion and comments on my implementation and possible improvements.

Do you mind if I copy (with credits) some Delegation example to include on my site ?

By: Dan

Dan — Thu, 04 Oct 2007 20:55:16 +0000

How do you go about using either (bubbling or handling) to the history plugin by Klaus?

$(’a.remote’).remote(’#place’, function() {
if (window.console && window.console.info) {
console.info(’content loaded’);
}

});

$.ajaxHistory.initialize();

By: Chris Heilmann

Chris Heilmann — Sat, 28 Apr 2007 07:13:17 +0000

Anthony this is as easy, just add another handler to the UL elements inside the others or handle the functionality in the listener method. The listener method gets everything in the element, so you can compare the nodeName of the target element with UL and do other stuff.

By: Anthony Ettinger

Anthony Ettinger — Fri, 27 Apr 2007 22:44:37 +0000

I understand the reasoning if you want all your child elements to do the event, but what should I do in the case of a behavior like:

ul.onmouseout=closeAllChildren;

…

The problem I’m having is that all the children elements will also call the function when I leave them, but am still inside the UL element.

Please help, this has been escaping me for awhile.