可通过可选文本进行排序

Question

是否可以拥有可排序的元素，但仍然允许用户复制/粘贴元素内的文本？

<div class="sortable">
   <div class="pseudo-sortable">Foo</div>
   <div class="pseudo-sortable">Bar</div>
   <div>other stuff that i don't care if a user 
        can't copy (maybe images or buttoms)</div>
</div>

我可以轻松做到：

$('.sortable').sortable({cancel: '.pseudo-sortable'});

这将允许我在浏览器中选择文本，并根据需要进行复制/粘贴。然而，这也使得该人无法拖/放。所以我想我想要的是从取消开始，但是如果鼠标在容器外移动一定距离，那么伪排序就不再被取消。这有道理吗？

如果这是不可能的，我的最后一个选择是应用一个触发器，在可排序和不可排序之间切换容器，以便它们可以选择文本，但我更愿意最小化 ui 点击次数。

Answer 1

将文本放入 中怎么样？

HTML

<ul id="sortable">
    <li><span>Item 1</span></li>
    <li><span>Item 2</span></li>
    <li><span>Item 3</span></li>
    <li><span>Item 4</span></li>
    <li><span>Item 5</span></li>
    <li><span>Item 6</span></li>
    <li><span>Item 7</span></li>
</ul>

jQuery

$("#sortable").sortable({
    revert: true,
    cancel: "#sortable li span"
});

在这里试试：http://jsfiddle.net/6uXx8/

Answer 2

尝试添加句柄。这个想法是，您只能从手柄开始拖动项目，例如，该项目可以是元素内的图标。