jquery UI可排序：如何更改；占位符；对象

在占位符处给出的示例中，拖动任何项目时出现的橙色框

可以使用

占位符

选项调整此元素，但它只允许您修改元素的类，如下所述：

我想更多地自定义此元素，例如，通过向

占位符

选项提供函数，就像向

助手

选项提供函数一样

---

要做到这一点，我需要更改什么（例如在sortable.js中？

查看ui.sortable.js（1.7.2）的源代码，您可以作弊并将

占位符设置为具有
元素
函数和
更新
函数的对象。
元素
函数用于返回占位符dom对象，而
更新
函数允许您执行诸如更正其大小之类的操作（如果您想查看默认实现的功能，可以查看sortable中的
\u createPlaceholder
函数）

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

$（“#可排序”）.sortable({
占位符：{
元素：函数（currentItem）{
返回$（“
测试”
”）[0]；
},
更新：功能（容器，p）{
返回；
}
}
});

如果我正确读取源代码，那么
元素
函数应该传递给当前项（jQuery对象），并且
这个
应该指向
可排序的
本身（在本例中是
$（“#可排序的”）
）。在
update
中，您被传递了“container”，它是包含所有选项的对象、元素等以及
占位符本身

请注意，这是一个未记录的黑客行为，因此它显然不受支持&可能会随着jQuery UI的下一版本而改变。。。但它仍然可能对您有用，因为您一直在谈论直接编辑
ui.sortable.js

希望这会有所帮助。
我发现了一种更为粗俗的方法：可以使用
start
选项修改占位符元素，例如如下所示

$("#sortable").sortable({
    start: function (e, ui) { 
      // modify ui.placeholder however you like
      ui.placeholder.html("I'm modifying the placeholder element!");
    }
});

美丽的；如果要在拖动时为项目设置固定高度（例如，由于项目很大），使其可排序，可以使用（在上面的更新函数中）：
container.refreshPositions（）这就解决了所有问题。哇哦！我现在使用这个技巧来实现可拖动图标，当拖动到链接的排序表上时，这些图标显示为它们所表示的DOM元素！额外的荣誉阅读来源；我试过了，现在我需要药物。很棒的解决方案。非常感谢。我在表之间的排序以及由于列数不同而调整表的大小方面遇到了问题，所以我使用了这个解决方案，但是使用了
return$（“”）[0]来解决问题。@Johannes使用此代码，您可以设置与列数相关的列间距：
return$（''）[0]我不知道是否有什么变化，但这对我有效，而Alconja的没有。我不认为这是一个黑客行为；官方文档（）在概述部分显示
ui.placeholder
，在事件部分显示
start
回调。我认为这是官方支持的方法。同意，OP描述的函数形式会很好，但在它进入项目之前，我认为这是实现目标的认可方法。注意：此方法仅更新占位符的内容，不会更改占位符元素本身（attributes/classes/…）Alconja的方法让您拥有完全的控制权。@ezwrighter如果您调用
ui.placeholder.html（）
，当然可以。但是
ui.placeholder
是实际的占位符元素。您可以对它做任何其他元素可以做的事情，包括设置它的样式或向它添加内容。
$("#sortable").sortable({
    start: function (e, ui) { 
      // modify ui.placeholder however you like
      ui.placeholder.html("I'm modifying the placeholder element!");
    }
});