Question

I’m developing some javascript widget which loaded on many other sites.

When widget are loading I bind jquery live event on links and buttons.
For instance:

$('.my-submit').live('click', function() {...});
...
$('.my-link').live('click', function() {...});

So the question is how can I remove all live events only for widget links and buttons?

Answer 1

The simple way to do this is to bind with a namespace, and remove all the namespaced events:

$('.my-submit').live('click.myPlugin', function() {...});

You can then call die with the namespace:

$('.my-submit').die('click.myPlugin'); // only myPlugin events are removed

Better yet is to use the on and off functionality introduced in jQuery 1.7. This is a far superior way to handle binding and unbinding events:

$(document).on('click.myPlugin', '.my-submit', function() {...}))
           .on('click.myPlugin', '.my-link', function() {...}));

$(document).off('click.myPlugin'); // remove all myPlugin functions