jQuery bind(), live(), delegate(), on() clarification

Transcript

1. Oursky Weekly Presentation jQuery bind(), live(), delegate(), on() clarification
2. Web View... Starting with sample code.. HTML...
3. Simple Binding JS... Notes Most common binding Attaches the event handler to every matched elements Doesn’t work for dynamic elements added later on (such as ajax)
4. Live() JS... Notes Similar syntax Binding still works when dynamic elements added later on Attached the event handler to “document” once StopPropagation not working already because the event is propagated to the root to handle already Have performance issues
5. Delegate() JS... Notes Only bind to selected root element The event still propagated from target element to selected root element, but it is much better than live()
6. On() bind(), live() and delegate() just become one line call in jQuery 1.7, as well as their unbinding methods
7. Custom events? JS... Notes It also works on custom binding events!
8. Credits Web Dev .NET - Differences Between jQuery .bind() vs .live() vs .delegate() vs .on() http://www.elijahmanor.com/2012/02/differences-between-jquery-bind-vs-live.html jQuery on() http://api.jquery.com/on/