Jquery ui-sortable: 通过图标“ handle”在 sortable 元素中拖动

我使用 jquery ui sortables 工作得很好，但我的可排序元素中包含其他交互元素。为了防止在与可排序 div 中的元素交互时发生意外排序，我想设法使可排序 div 的拖动操作仅在拖动可排序 div 中的某个元素时发生，例如可能位于每个可排序 div 左上角的“ move”图标。使用通用 jqui 可以做到这一点吗? 还是需要编写自己的钩子？

56549

小开

最佳答案

插件的选项 < a href = “ http://api.jqueryui.com/sortable/# option-handle”rel = “ norefrer”> handle 允许您定义可以启动排序的元素。可以提供选择器或元素。

如果你有这个 html，用 .handler作为句柄来开始排序:

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

像下面这样应用选项:

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

您可以按照自己的喜好设置句柄元素的样式。