Reinitialize jQuery UI droppable after adding elements

问题

I have some elements that on page load are droppable. At some points I add some more of these elements (same selector) and I want the new elements to be droppable as well. Is the only option to call the original droppable function with all the options? You see, The droppable function call is pretty big, and I don't really want to duplicate code this way. Is there a more elegant way?

this is the code for clarification:

$('td:not(.td-disabled)').droppable({
        hoverClass: "ui-state-active",
        drop: function( event, ui ) {
            // ... very big block of code 
        }
    });
$('.td-disabled').removeClass('td-disabled');

// I dont want to do this:
$('td').droppable({
            hoverClass: "ui-state-active",
            drop: function( event, ui ) {
                // ... very big block of code 
            }
        });

回答1:

You can try:

var hoverCls = 'ui-state-active';
var dropFn = function(event, ui) {

};

$('td').droppable('destroy').droppable({
   hoverClass: hoverCls,
   drop: dropFn
});

来源：https://stackoverflow.com/questions/15315422/reinitialize-jquery-ui-droppable-after-adding-elements