There is an
Element.Delegation<http://mootools.net/docs/more/Element/Element.Delegation>module
in MooTools More.
It allows this: $('#myUL').addEvent('click:relay(li a)', myHandlerFn);
On Mon, Jan 31, 2011 at 7:45 AM, Clement Hallet <[email protected]> wrote:
> Nice ! I'm getting used to be amazed with already what's already inside
> Mootools !
>
>
> Le 31 janv. 2011 à 16:32, Ryan Florence a écrit :
>
> >
> http://ryanflorence.com/event-delegation-with-mootools-quit-selecting-all-those-elements/
> >
> >
> > On Jan 31, 2011, at 8:21 AM, Clement Hallet wrote:
> >
> >>> Your "ul" element will receive all the clicks from any element inside
> it, (if the event is not stopped of course)
> >>> the ones that exists, and the ones that may be created later.
> >>
> >> Code updated to see click handling on new elements :
> http://jsfiddle.net/QXsMM/9/
> >>
> >>
> >> Le 31 janv. 2011 à 16:11, Clement Hallet a écrit :
> >>
> >>> As told before, you can use the event delegation :
> >>>
> >>> Your "ul" element will receive all the clicks from any element inside
> it, (if the event is not stopped of course)
> >>> the ones that exists, and the ones that may be created later.
> >>> This is called "bubbling" and there is several article about this.
> >>>
> >>> By using that behavior you can write this code :
> http://jsfiddle.net/QXsMM/6/
> >>>
> >>> This is the same mechanism as the one from the jQuery Live plugin.
> >>>
> >>> --
> >>> Clément
> >>>
> >>>
> >>> Le 31 janv. 2011 à 15:42, roark a écrit :
> >>>
> >>>> Hi Clement,
> >>>>
> >>>> Thanks for the quick response!
> >>>>
> >>>> I have added the code on jsfiddle so it can be viewed here:
> >>>> http://jsfiddle.net/roark/QXsMM/5/
> >>>>
> >>>> Thanks again for your help
> >>>>
> >>>> On Jan 31, 4:07 pm, Clement Hallet <[email protected]> wrote:
> >>>>> Hi,
> >>>>>
> >>>>> You can use only one listener and deals with event delegation.
> >>>>> Could you please put your code onhttp://jsfiddle.net/and i'll try to
> help you.
> >>>>>
> >>>>> --
> >>>>> Clément
> >>>>>
> >>>>> Le 31 janv. 2011 à 15:00, roark a écrit :
> >>>>>
> >>>>>> Hi Everyone,
> >>>>>
> >>>>>> I think I must be writing bad code here.
> >>>>>
> >>>>>> I will load a page with a few li's with links in them. once loaded,
> I
> >>>>>> add events to the links
> >>>>>> [code]
> >>>>>> $$('li a').each(function(el){
> >>>>>> el.addEvent('click',function(e){
> >>>>>> e.stop();
> >>>>>> //code to execute
> >>>>>> });
> >>>>>> });
> >>>>>> [/code]
> >>>>>
> >>>>>> Then when I create an element dynamically I am writing the same code
> >>>>>> again:
> >>>>>> [code]
> >>>>>> var li = new Element('li').inject($('ul.list'));
> >>>>>> var del = new Element('a', {'class':'delete sprite',
> >>>>>> 'title':'delete'+player.name}).inject(li);
> >>>>>> //code being repeated
> >>>>>> el.addEvent('click',function(e){
> >>>>>> e.stop();
> >>>>>> //code to execute
> >>>>>> });
> >>>>>> [/code]
> >>>>>
> >>>>>> It may not look like much but when I send requests the code gets
> long
> >>>>>> and it seems I'm duplicating code when I add the 'click' event.
> >>>>>
> >>>>>> This seems like bad code to me, but can't think of a way to write it
> >>>>>> any more efficient
> >>>>>> Any input is greatly appreciated!
> >>>
> >>
> >
>
>
