如何排除元素在可排序列表中被拖动?

时间:2012-12-14 20:18:45

标签: jquery jquery-ui jquery-ui-sortable jquery-ui-draggable

如何从可排序列表中排除元素?例如,有一个类名为“note”的元素,我想要可拖动

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

3 个答案:

答案 0 :(得分:41)

您需要使用取消。

参见工作示例here

JS:

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

正如@Zephyr指出的那样,让你通过拖动兄弟姐妹来重新安排这个位置,如果你想避免这种情况,请使用owise1 approach

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

答案 1 :(得分:22)

您可以使用sortable的“items”选项:

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

example

...或

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

example

答案 2 :(得分:4)

您可以使用以下内容明确排除项目

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