選択可能なテキスト付きソート可能

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

あなたのテキストをaに置くのはどうですか <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

を追加してみてください 取り持つ. 。アイデアは、たとえば要素内のアイコンである可能性があるハンドルからのみアイテムのドラッグを開始できるということです。