Jquery ui - sortable：在可排序元素中拖动图标'handle'

Question

我有jquery ui sortables正常工作，但我的可排序元素中还有其他的交互元素。为了防止在与可排序div中的元素交互时意外排序，我想以某种方式使得可排序的拖动运动仅在拖动可排序的某个元素时发生，例如可能存在的“移动”图标在每个可排序的左上角。这可能是通用的jqui，还是我需要编写自己的钩子？

Answer 1

插件的选项 handle 允许您定义可以启动排序的元素。您可以提供选择器或元素。

如果你有这个html，.handler是开始排序的句柄：

<ul class="sortable">
    <li>
        <span class="handle"></span>
        My element
    </li>
</ul>

应用如下选项：

$( ".sortable" ).sortable({ handle: '.handle' });

您可以随意设置手柄元素的样式。