Move this topic
Differences between .on() and .live()
in Using jQuery
•
10 years ago
How can we move to .on(), when .on() only binds to dom that is in the page currently. It does not bind to dom that are added later on.
1
Replies(6)
Re: Differences between .on() and .live()
10 years ago
Replacing live() with on() requires the use of delegating the events. Read the paragraph on this page (http://api.jquery.com/on/) that starts with "Direct and Delegated Events".
Essentially what you're doing is placing the handler on an ancestor element and letting it bubble up from the descendant. An example from that page:
Dave
Essentially what you're doing is placing the handler on an ancestor element and letting it bubble up from the descendant. An example from that page:
- $("#dataTable tbody").on("click", "tr", function(event){
means that you are binding the event to the tbody of the table, however since events "bubble up", if a descendant element is clicked the event will eventually reach the tbody. If the handler has been bound like above it will then fire when the event gets there. The code above also filters it so that if the event did not originate from a tr, it will be ignored.
Hope that cleared it up a littleDave
Leave a comment on dsvick's reply
Re: Differences between .on() and .live()
10 years ago
Hi dsvick,
Thanks for the detail reply. I am sot sure, but guessing something like the following,
If a new tr elements is added in the dom then the event on that tr will bubble up to tbody and tbody handles the event. Is that right?
Leave a comment on ashrafuzzaman.g2's reply
Re: Differences between .on() and .live()
10 years ago
At this page: http://api.jquery.com/on/
the doc says:
Event handlers are bound only to the currently selected elements; they must exist on the page at the time your code makes the call to .on()
. To ensure the elements are present and can be selected, perform event binding inside a document ready handler for elements that are in the HTML markup on the page. If new HTML is being injected into the page, select the elements and attach event handlers after the new HTML is placed into the page. Or, use delegated events to attach an event handler, as described next.
Probably I cannot understand what you mean with delegate event, but using 'delegate()' method work fine.
-
$(
saveQuantity(event);
...
So my question now change in:
what's the differnces beetween on, live and delegate ?!!?!
Leave a comment on realtebo's reply
Re: Differences between .on() and .live()
10 years ago
ashrafuzzaman:
You're correct, when the tr is clicked the event will bubble up to the tbody, then to the table, and so on. It can be handled at any point and that is what on() lets you do.
realtebo:
All three of those methods do almost the same thing, there is some differences with propagation and where the events are actually handled but essentially they all have the same effect. The biggest difference is that, while not actually deprecated, live() and delegate(), have been replaced with on() and that is the recommended method.
You're correct, when the tr is clicked the event will bubble up to the tbody, then to the table, and so on. It can be handled at any point and that is what on() lets you do.
realtebo:
All three of those methods do almost the same thing, there is some differences with propagation and where the events are actually handled but essentially they all have the same effect. The biggest difference is that, while not actually deprecated, live() and delegate(), have been replaced with on() and that is the recommended method.
Leave a comment on dsvick's reply
Re: Differences between .on() and .live()
10 years ago
thanks a lot, i replace all of live and delegate occurrencies with on and all is working now.
just a note: in the doc of 'live', there is a note about deprecation ... but, really, it's not in the deprecated category of documentation
As of jQuery 1.7, the
.live()
method is deprecated
Leave a comment on realtebo's reply
Leave a comment on jay.blanchard's reply
Change topic type
Link this topic
Provide the permalink of a topic that is related to this topic
Reply to ashrafuzzaman.g2's question
Statistics
- 6 Replies
- 9372 Views
- 2 Followers