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

如何将文字放入<span>？

<强> 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

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

可选择的文本可排序

2 个答案: