jQuery e.target bubbling best practice ?
- by olouv
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).