Sortable w/Selectable Text

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'}); 

Это позволит мне выбрать текст в браузере и копировать/вставить, если я хочу. Тем не менее, это также делает так, что человек не может перетаскивать. Поэтому я думаю, что я хотел бы начать с отмены, но если мышь на определенном расстоянии за пределами контейнера, то псевдо-сортировки больше не будут отменены. Имеет ли это смысл?

Если это невозможно, последним вариантом будет применение триггера, который переключает контейнеры между сортируемыми и не сортируемыми, чтобы они могли выбирать текст, но я бы предпочел минимизировать клики.

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. Идея состоит в том, что вы можете начать перетаскивание элемента из дескриптора, что может быть, например, значком внутри элемента.