Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Performance difference between jQuery's .live('click', fn) and .click(fn)

I love the new live event in jQuery 1.3. The question I have is the performance of this event. I know the advantages of using live over click/bind('click') but is there a performance hit for using it over click/bind('click')?

If not, why would you ever use click or bind('click')?

like image 974
Mike Avatar asked Sep 02 '09 14:09

Mike


People also ask

What is the difference between .on click function ()) and .click function?

on() differs from . click() in that it has the ability to create delegated event handlers by passing a selector parameter, whereas . click() does not.

What is the difference between on click and click in jQuery?

So onclick creates an attribute within the binded HTML tag, using a string which is linked to a function. Whereas . click binds the function itself to the property element.

What is Live function in jQuery?

jQuery live() Method The live() method attaches one or more event handlers for selected elements, and specifies a function to run when the events occur. Event handlers attached using the live() method will work for both current and FUTURE elements matching the selector (like a new element created by a script).


2 Answers

If not, why would you ever use click or bind('click')?

Because $.live() has some significant disadvantages

  • Live events do not bubble in the traditional manner and cannot be stopped using stopPropagation (This changed in jquery 1.4.4) or stopImmediatePropagation. For example, take the case of two click events - one bound to "li" and another "li a". Should a click occur on the inner anchor BOTH events will be triggered. This is because when a $("li").bind("click", fn); is bound you're actually saying "Whenever a click event occurs on an LI element - or inside an LI element - trigger this click event." To stop further processing for a live event, fn must return false.
  • Live events currently only work when used against a selector. For example, this would work: $("li a").live(...) but this would not: $("a", someElement).live(...) and neither would this: $("a").parent().live(...).
like image 75
Peter Bailey Avatar answered Oct 08 '22 13:10

Peter Bailey


See this.

As for why you would ever use click or bind instead of live, the answer is because you don't need the extra functionality.

like image 33
code_burgar Avatar answered Oct 08 '22 12:10

code_burgar