jQuery重新初始化/刷新可拖动/可排序元素

Question

我有几个函数，我加载在ready（）事件。这些基本上可以拖动列表，其他区域可以拖放/排序。例如。您可以将克隆拖入多个区域（div中的列表），并且在这些多个区域中，您可以对它们进行排序/重新排序（但仅限于每个区域内）。这工作完美。

我有一个按钮，它动态地创建一个新的区域项目被放入，然后排序。它完美地创建了新的区域，但是不能将物品放入其中，或者甚至不能将它们排序。

我意识到这是事实上，我正在使用ready（）事件在页面加载时使所有区域可以droppable/sortable，而不是实际上重新运行这些函数动态。

我已经尝试在按钮的点击功能中对这些元素使用“刷新”。例如。

$(".field > li").draggable('refresh'); 
$(".dragrow1, .dragrow2").droppable('refresh'); 
$(".dragrow1, .dragrow2").sortable('refresh'); 

但这不起作用。如果我能帮忙，我想避免以任何方式重复我的代码。有没有办法使这项工作？我认为如果有一些类似于'ready（）'的'live（）'函数，那么这可能是一个解决方案，但没有......！

谢谢。

Answer 1

为什么不将自己的初始化编码为自己的jQuery插件？然后，您的初始化代码以及添加动态元素的代码就可以设置这种方式。

jQuery(function() { 
    jQuery.fn.myDroppableSetup = function myDroppableSetup() { 
    this.each(function() { 
     // your setup code here 
    }); 
    return this; 
    }; 
    jQuery.fn.myDraggableSetup = // ... 
}); 

然后，你可以重新使用，当你添加的东西动态：为响应

$('div.newlyAddedDroppable').myDroppableSetup();