jquery UI sortable：如何更改“占位符”对象的外观？

在 http://jqueryui.com/demos/sortable/#placeholder给出的示例中，占位符是拖动任何项目时出现的橙色框。

此元素可以使用占位符选项进行调整 – 但它只允许您修改元素的类，如下所述：http://jqueryui.com/demos/sortable/#options

我想更自定义这个元素，例如。通过以与可以向助手选项提供功能相同的方式向占位符选项提供功能。

我需要改变什么(例如在sortable.js)做这个？

解决方法

查看ui.sortable.js(1.7.2)的源代码，你可以通过元素函数和更新函数来欺骗和设置占位符到一个对象。元素函数用于返回占位符dom对象，并且更新函数允许你做正确的大小(你可以查看_createPlaceholder函数里面sortable如果你想看到默认实现)。

因此，例如，下面将创建一个带有单词test inside作为占位符的列表项(注意，它返回实际的dom对象([0])，而不是jQuery对象本身)：

$("#sortable").sortable({
    placeholder: {
        element: function(currentItem) {
            return $("<li><em>test</em></li>")[0];
        },update: function(container,p) {
            return;
        }
    }
});

如果我正确地读取源，元素函数应该传递当前项目(jQuery对象)，这应该指向可排序本身(即$(“#sortable”)在这种情况下)。在更新中，你传递“容器”，它是包含所有选项的对象，&元件等&占位符本身。

请注意，这是一个无证的黑客，所以它显然是不支持&可能会改变与下一个版本的jQuery UI …但它仍然可能对你有用，假设你在谈论编辑ui.sortable.js直接反正。

希望有帮助。