>
> In fact, when thinking about it, I'm not completely sure that
> .stopImmediatePropagation() should have an effect, either (even though
> it does, now - for example, if you had bound the events in a different
> order, the li first, then the li a, even stopImmediatePropagation
> would've failed).
>
Before I sent my other e-mail I already suspected that. But had no time to
test and debug it. The stopImadiatePropagation will stop not only the
propagation (if it's running) but also the next events that are bound to the
same element jQuery is already processing. So if $('li a').live() is bound
before $('li').live() then the stopImediatePropagation works in the fist
event to stop the second, but not otherwise. This is useful to know and can
be used by a developer to improve his/her usage of .live()
The problem is that this only makes sense for thouse aware of how jQuery
queue the events.
Is actually saying "Anytime a click occurs on an element that matches
> '#list li' OR on an element contained within an element that matched
> '#list li' trigger this bound click event on that element." There is
> no propagation involved there.
>
Updating the documentation on this, as John already did, is essential but do
not clarify it entirely as it is now. In fact stopImediatePropagation
depends on the order the events whore bound.
Another question I have is: Should jQuery try to simulate the way
traditional propagation works? This could be useful for middle and new
developers, witch would only need to understand propagation and it's
differences to delegation.
The liveHandler could try to fire the events in order of propagation and not
the bound order, falling back to bound order only when the element is the
same.
I'll look into that later when I arrive at home from work. My idea is to
save with $.data (or return it somehow) how much deeper the .closest() had
navigate from the target itself. Then in liveHandler we could fire them in
that order, not the bound one.
Any toughts?
--
Iraê
On Tue, Jan 20, 2009 at 3:16 PM, John Resig <[email protected]> wrote:
>
> Ok, so I looked at this issue more and I think the problem is being
> confused.
>
> Let's pretend that you only had one event bound:
> > $("#list li").live('click', function(e) {
> > alert('li clicked');
> > });
>
> That click will triggered if the li is clicked or if the a is clicked
> - it doesn't matter.
>
> Now let's look at this case:
>
> > $("#list li a").live('click', function(e) {
> > alert('a clicked');
> > });
> >
> > $("#list li").live('click', function(e) {
> > alert('li clicked');
> > });
>
> Just because you have an event bound to an inner element in addition
> to an outer element shouldn't affect what's going on - there's no
> bubbling occurring.
>
> In fact, when thinking about it, I'm not completely sure that
> .stopImmediatePropagation() should have an effect, either (even though
> it does, now - for example, if you had bound the events in a different
> order, the li first, then the li a, even stopImmediatePropagation
> would've failed).
>
> So - a solution to your problem, then. I'd recommend enforcing the
> target within your li live event.
>
> $("#list li").live('click', function(e) {
> if ( $(e.target).is("li") )
> alert('li clicked');
> });
>
> or:
>
> $("#list li").live('click', function(e) {
> if ( $(e.target).not("a") )
> alert('li clicked');
> });
>
> The important point is that:
> $("#list li").live('click', ...);
>
> Is actually saying "Anytime a click occurs on an element that matches
> '#list li' OR on an element contained within an element that matched
> '#list li' trigger this bound click event on that element." There is
> no propagation involved there.
>
> In this way live events are different from normal events - I will make
> a note of it in the documentation.
>
> --John
>
>
>
> On Tue, Jan 20, 2009 at 2:18 AM, Walther <[email protected]> wrote:
> >
> > Thanks, e.stopImmediatePropagation() works fine. But e.stopPropagation
> > () and return false; doesn't.
> >
> > Sorry John, I don't have example url available.
> >
> > However I can post example code here:
> >
> > <ul id="list">
> > <li id="item_1"><a href="#">Item 1</a></li>
> > <li id="item_2"><a href="#">Item 2</a></li>
> > <li id="item_3"><a href="#">Item 3</a></li>
> > <li id="item_4"><a href="#">Item 4</a></li>
> > </ul>
> >
> > Script is:
> > $("#list li a").live('click', function(e) {
> > e.stopPropagation();
> >
> > alert('a clicked');
> > });
> >
> > $("#list li").live('click', function(e) {
> > alert('li clicked');
> > });
> >
> > If I change the e.stopPropagation() line to e.stopImmediatePropagation
> > () then it works fine, thanks Ariel. Could it be a bug, or just me
> > being stupid (I am good at being stupid)?
> >
> > Walther.
> >
> > On Jan 19, 8:43 pm, Ariel Flesler <[email protected]> wrote:
> >> $('li a').live('click',function(e){
> >> // do stuff with link clicked
> >>
> >> });
> >>
> >> $('li').live('click',function(e){
> >> if( $(e.target).is('a') )
> >> return;
> >> // do stuff when li is clicked
> >>
> >> });
> >>
> >> Instead of the "if" within the second handler, you could do
> >> e.stopImmediatePropagation() on the first.
> >> Any of those should do.
> >>
> >> --
> >> Ariel Fleslerhttp://flesler.blogspot.com
> >>
> >> On Jan 19, 8:21 am, Walther <[email protected]> wrote:
> >>
> >> > I am having a issue with the live event functionality in jQuery 1.3.
> >>
> >> > Basically, I have a list with various options in this form:
> >> > <ul>
> >> > <li><a href="something">Bla</a></li>
> >> > .
> >> > .
> >> > .
> >> > .
> >> > </ul>
> >>
> >> > I want to do something when the user clicks on the list item (it has a
> >> > rather wide width), and I want to do something else when the user
> >> > clicks on the link inside the list item. Since the list is going to be
> >> > a dynamic list I need to use live events.
> >>
> >> > However, when I use live events and click on the <a> tag, the event
> >> > for the list item is also fired. I have tried putting return false;
> >> > and event.stopPropagation(); into the event function, it doesn't work.
> >> > However, when I use the normal bind() function (instead of live()) it
> >> > works as intended(expect for it not being a live event which I want).
> >>
> >> > I am guessing that I am doing something stupid that is preventing it
> >> > from working, any help would be apprechiated.
> >>
> >> > Regards
> >> > Walther
> > >
> >
>
> >
>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery Development" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-dev?hl=en
-~----------~----~----~----~------~----~------~--~---
