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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/13885665/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 13:03:42  来源:igfitidea点击:

How to exclude an element from being dragged in sortable list?

jqueryjquery-uijquery-ui-sortablejquery-ui-draggable

提问by laukok

How can I exclude an element from sortable list? For instance, there is an element with class name 'note' that I don'twant to be 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 notobviously does not work...

jquery ui 可排序,jquerynot显然不起作用...

$(function() {
    $( ".sortable:not(.note)" ).sortable(
    }).disableSelection();
});

回答by Trufa

You need to use cancel.

您需要使用取消。

See working example here.

请参阅此处的工作示例。

Js:

JS:

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

As @Zephyr points out, this let's you re-arrange the position by dragging the siblings, if you want to avoid that, use owise1 approach:

正如@Zephyr 指出的那样,这让您可以通过拖动兄弟姐妹来重新排列位置,如果您想避免这种情况,请使用owise1 方法

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

回答by owise1

You could use sortable's "items" option:

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

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

example

例子

or...

或者...

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

example

例子

回答by Mladen Janjetovic

You can explicitly exclude items with:

您可以通过以下方式明确排除项目:

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