Question

In most cases, I’ve been setting an event class handler that will apply to subsequently created elements of that class as follows:

$('#container').on('click', '.myClass', function (e) {...

However, I don’t know how to do this with draggable. The following doesn’t affect subsequently created objects:

$('.myClass').draggable(...

As a consequence, I’ve been repeatedly making the class draggable (with the line above) after each new draggable object is created.

What I want to know is whether this is creating multiple event handlers on the class, or am I just reestablishing the same handler? Is there some equivalent to .off() that I should be using?

Thanks.

Answer 1

You can use destroy method to remove draggable and then reinitialize it like

$('.myClass').draggable('destroy').draggable(...

Read more here http://jqueryui.com/demos/draggable/#method-destroy