.live () to .on ()

Question

I have a problem that cannot be solved.

This code is great for me.

// click row opens message, unless you click delete $('.delete_message-link-js').live('click', function(e) { e.preventDefault(); }); $('.item-message').live('click', function(e){ //.item-message - tr lass window.location = $(this).find(".show_message-link").attr("href"); }); 

But when I change .live () to .on ()

 // click row opens message, unless you click delete $('.delete_message-link-js').on('click', false ); $('.item-message').on('click', function(e){ window.location = $(this).find(".show_message-link").attr("href"); }); 

I have a bug in Firefox. When I click the link .delete_message-link-js in the table row, I get an error

request aborted by user
throw Components.Exception ... by user ", Cr.NS_ERROR_NOT_AVAILABLE);

But the code works in Safari.

What am I doing wrong?

Thanks and sorry for my english

Answer 1

Read the documentation:

http://api.jquery.com/on/

This shows that the on equivalent of this:

 $('.delete_message-link-js').live('click', function(e) { e.preventDefault(); }); 

is an:

 $( document ).on( "click", ".delete_message-link-js", function(e){ e.preventDefault(); }); 

And so on.

You can also read the source code to see how live converted to on :

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

this.context is document (the default context, since you did not specify any context), and this.selector is '.delete_message-link-js' for the above example.

Answer 2

You need to attach .on() to the element's parent element:

 // Pseudocode... $('#parent of .delete_message-link-js').on('click', '.delete_message-link-js', false );