Jquery ui - sortable：在可排序元素中拖动图标'handle' [英] Jquery ui - sortable: drag by icon 'handle' within sortable element

问题描述

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

I have jquery ui sortables working fine but my sortable elements have other interactive elements within them. In order to prevent accidental sorting when interacting with the elements within the sortable divs, I'd like to somehow make the dragging movement for the sortables only occur when dragging a certain element within the sortable, such as a 'move' icon that might reside in the top left corner of each sortable. Is this possible with generic jqui, or would I need to write my own hook?

推荐答案

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

The option handle of the plugin allows you to define that is the element that can initiate the sort. You can provide a selector or an element.

如果你有这个html，那么 .handler 就是处理开始排序：

If you have this html, with the .handler to be the handle to start the sort:

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

应用如下选项：

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

您可以根据需要设置手柄元素的样式。

You can style your handle element however you like.

这篇关于Jquery ui - sortable：在可排序元素中拖动图标'handle'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！