9

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

<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 点击。

4

2 回答 2

19

把你的文本放在一个<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/

于 2010-11-12T19:50:02.627 回答
1

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

于 2010-11-12T17:36:00.653 回答