jQuery e.target bubbling best practice ?

Posted by olouv on Stack Overflow See other posts from Stack Overflow or by olouv
Published on 2010-12-21T16:20:25Z Indexed on 2010/12/23 9:54 UTC
Read the original article Hit count: 293

Filed under:
|

In my heavy-ajax code, i always bind "click" the body tag & act depending on $(e.target) & using $.fn.hasClass(). However when i click on an anchor that has a </span> tag inside, my $(e.target) equals this node, and not the parent anchor as i would like it to.

From now on, i have used this trick (var $t = $(e.target);) :

/** bubbling **/
if($t.get(0).tagName !== "A" && $t.get(0).tagName !== "AREA") {
    $t = $t.parent("a");
   if(empty($t)) return true;
   //else console.log("$t.bubble()", $t);
}

It feels wrong somehow... Do you have any better implementation ?


$.fn.live() does not solve my issue as it still returns the span as the target. Moreover i'm looking for speed (running on atom-based touch devices) & live appeared to be way slower (twice) : http://jsperf.com/bind-vs-click/3


In fact, as @Guffa pointed, using $.fn.live() solves the span bubbling issue as i don't need the event.target anymore. I guess there is no other "right" answer here (using bind).

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about event-bubbling