Question

虽然应该相对简单，但我无法弄清楚如何在LI之间移动（而不是复制）UL元素。

我想要的只是将列表 foo 中的任何项目拖到列表 bar （反之亦然）而不复制元素。

虽然connectToSortable几乎完全符合我的要求（虽然我宁愿避免sortable），但它会克隆元素 - 并通过对stop作出反应手动删除原始元素事件证明并不那么容易（例如确保实际发生了有效的下降）。

一个简单的“你好世界”的例子对我有很大帮助。

Answer 1

可以在此处找到Hello World示例：http://jqueryui.com/demos/sortable/#connect-lists。您根本不需要draggable，只需要sortable。

$(function() {
    $("#sortable1, #sortable2").sortable({
        connectWith: '.connectedSortable'
    }).disableSelection();
});

如果您想禁止在一个列表中对项目进行排序，这可能是一种方法。虽然它不是最漂亮的UI（用户被给予了错误的希望），但用户也可以自由地确定外部列表中的放置位置。

$(function() {
    var sender;
    var recvok = false;
    $("#sortable1, #sortable2").sortable({
        connectWith: '.connectedSortable',
        start: function() {
            sender = $(this);
            recvok = false;
        },
        over: function() {
            recvok = ($(this).not(sender).length != 0);
        },
        stop: function() {
            if (!recvok)
                $(this).sortable('cancel');
        }
    }).disableSelection();
});

这是一个非常可怕的功能，解决了我认为jQuery UI中的不完整性。它将发送者保存在sortstart上并取下允许丢弃的标志。当输入另一个接收器时，它会检查它是否不是发送者并将标志置于其中。在sortstop上，检查标志。警告：这个功能对于用户和程序员来说都是丑陋的，但它确实有效。

jQuery UI：将项目从一个列表移动到另一个列表

1 个答案: