jquery UI 可排序 : how can I change the appearance of the "placeholder" object?

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

这个元素可以使用 placeholder 选项进行调整——但它只允许你修改元素的类，如下所述:http://jqueryui.com/demos/sortable/#options

我想更多地自定义这个元素，例如通过以与向 placeholder 选项提供函数相同的方式向 helper 选项提供函数。

我需要改变什么(例如在 sortable.js 中)才能做到这一点？

最佳答案

查看 ui.sortable.js (1.7.2) 的源代码，您可以欺骗并将 placeholder 设置为具有 element 函数和 update 函数的对象。 element 函数用于返回占位符 dom 对象，update 函数允许您执行诸如校正其大小之类的操作(如果您想了解默认实现，可以查看 sortable 中的 _createPlaceholder 函数)。

因此，例如，以下将创建一个列表项，其中包含单词 test 作为占位符(请注意，它返回实际的 dom 对象( [0] )而不是 jQuery 对象本身):

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

如果我正确读取源代码，则应将 element 函数传递给当前项(jQuery 对象)，而 this 应指向 sortable 本身(即此实例中的 0x25181222313)。在 $("#sortable") 中，您传递了“容器”，它是包含所有选项、元素等的对象以及 update 本身。

请注意，这是一个未公开的黑客 ，所以它显然不受支持，并且可能会随着下一版 jQuery UI 的变化而改变......但它仍然可能对你有用，因为你在谈论直接编辑 0x25184312231

希望有帮助。

关于jquery UI 可排序 : how can I change the appearance of the "placeholder" object?，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/2150002/