It's called event propagation or "bubbling".

If you add a click event to an element and then click a child of the element, 
the event propagates, or "bubbles" up to the parent element.

You need to stop propagation: http://jsfiddle.net/rpflorence/Fn3YC/1/

On Feb 28, 2011, at 7:47 AM, Antoine Nguyen wrote:

> Ok, I've found my mistake :p
> 
> Actually, what I'm trying to do can be represented like this : 
> http://jsfiddle.net/Fn3YC/
> 
> The problem is that events for both parent and child <li> tags (the second 
> entry) are triggered at the same time :p 
> 
> I need some extra information to make a distinction between elements. Does 
> anyone know how I can I do that please?
> 
> Thanks.
> 
> 2011/2/28 Antoine Nguyen <[email protected]>
> @Naytee
> 
> Yes I need to grab all the elements, regardless of their position. But this 
> is only true for this specific list. Basically, a <li> tag represents a 
> folder (that can contains subfolders). I would like to attach specific folder 
> actions (like rename or delete). 
> 
> 2011/2/28 Antoine Nguyen <[email protected]>
> 
> Humm you are right, I just check the returned elements in firebug and it 
> seems they're all here :D
> So my problem is elsewhere!
> 
> Thanks for your time and really sorry for my mistake.
> 
> 2011/2/28 Fli7e <[email protected]>
> hmm ... working like a charm:
> 
> 
>        <div id="myultest">
>                <ul>
>                        <li>1</li>
>                        <li>2</li>
>                        <li>
>                                <ul>
>                                        <li>3</li>
>                                </ul>
>                        </li>
>                </ul>
>        </div>
> 
>        <script>
>                document.id('myultest').getElements('li').each( function(elm){
>                        alert(elm.get('html'));
>                });
>        </script>
> 
> 
> On 28 Feb., 15:13, Antoine Nguyen <[email protected]> wrote:
> > Currently I'm using something like : $$("#div li"), which is equivalent to
> > what you proposed. (I just tried out your solution but the result is
> > similar)
> >
> > My list looks like this :
> > <ul>
> >   <li></li>
> >   <li></li>
> >   <li>
> >     <ul>
> >       <li></li>
> >     </ul>
> >   </li>
> > </ul>
> >
> > I'm able to access the first level of li tags but not the deepest one.
> >
> > 2011/2/28 Fli7e <[email protected]>
> >
> > > i guess you are looking for this:
> >
> > > document.id('divid').getElements('li')
> >
> > >http://mootools.net/docs/core/Element/Element#Element:getElements
> >
> > > On 28 Feb., 14:49, tonio <[email protected]> wrote:
> > > > Hi list,
> >
> > > > it may be a silly question but I'm wondering how I can select all <li>
> > > > tags inside a nested list. Using something like "#div li" only returns
> > > > the top level elements (which is what it should do, I know that).
> >
> > > > How can I achieve that?
> >
> > > > Thanks in advance,
> >
> > > > Antoine
> 
> 
> 

Reply via email to