web-dev-qa-db-ja.com

並べ替え可能なリストでの要素のドラッグを除外する方法は？

ソート可能なリストから要素を除外するにはどうすればよいですか？たとえば、クラス名が「note」で、I do n'tになりたい要素があるdraggable？

    <ul class="sortable">

            <li id="item_3">Item 3</li>
            <li id="item_4">Item 4</li>
            <li id="item_5">Item 5</li>

            <p class="note">This is a note only</p> 
   </ul>

jquery ui sortable、jquery notは明らかに動作しません...

$(function() {
    $( ".sortable:not(.note)" ).sortable(
    }).disableSelection();
});
jqueryjquery-uijquery-ui-sortablejquery-ui-draggable
33
laukok

キャンセルを使用する必要があります。

作業例を参照してください here 。

Js：

$(function() {
    $('.sortable').sortable();
    $('.sortable').disableSelection();
    $('.sortable').sortable({ cancel: '.note' });
});​

@Zephyrが指摘しているように、兄弟をドラッグして位置を再配置できます。それを避けたい場合は、 owise1 approach を使用します。

$('.sortable').sortable({
    items : ':not(.note)'
});
41
Trufa

Sortableの「 items 」オプションを使用できます。

$( ".sortable" ).sortable({
    items : 'li'
});

例

または...

$( ".sortable" ).sortable({
    items : ':not(.note)'
});

例

22
owise1

以下を使用してアイテムを明示的に除外できます。

$( ".sortable" ).sortable({
     cancel: ".disable-sorting"
});
4
Mladen Janjetovic