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! >>> >> >
