How to translate jQuery .live() to .on() with events bound to this?

Question

I\'m in the process of converting code from the deprecated .live() API to .on() (see the jQuery 1.7 release notes)

I have live events attached

Answer 1

The .selector property is undocumented and probably will be removed when .live() is removed. What did this code look like when you were using .live()? How are these plugins used?

Answer 2

$(selector).on(events, data, handler)

Still works fine. You could still use that. Check out the .on docs

Answer 3

As of jQuery 1.7, the ondocs function is used to replace the existing separate methods of binding events:

• binddocs
• delegatedocs
• livedocs

onedocs is a special case, and you should continue to use it as is.

The existing events continue to exist, and are simply aliases of on. There is no official report to suggest that they will be removed, so you'd be safe to continue to use them if you understand them better. live and die have been deprecated as of jQuery 1.7 as mentioned in a blog post and on the live docs.

The on event has multiple formats, but the function signature is as follows:

.on( events [, selector] [, data], handler )

Bind:

$(selector).bind(events, data, handler);
$(selector).on(events, null, data, handler);

Source:

bind: function( types, data, fn ) {
  return this.on( types, null, data, fn );
}

Delegate:

$(selector).delegate(subselector, events, data, handler);
$(selector).on(events, subselector, data, handler);

Source:

delegate: function( selector, types, data, fn ) {
  return this.on( types, selector, data, fn );
}

Live:

$(selector).live(events, data, handler);
$(document).on(events, selector, data, handler);

Source:

live: function( types, data, fn ) {
  jQuery( this.context ).on( types, this.selector, data, fn );
  return this;
}

_{Note that this.context was set using this.context = document; as specified at $(document).on(...).}

Answer 4

Give this a shot:

$(document).on('click', this.selector, handler);

A jQuery object has a selector property that represents the selector used to create that object.

Note that the selector is modified with traversal methods, so I would assume that your plugin is generally used upon initial DOM selection.

---

To avoid using an internal property, you could simply change the API of your plugin to require a selector to be passed explicitly.