使用 Jquery 在三个列表之间拖放答案

【问题标题】：drang and drop between three lists using Jquery使用 Jquery 在三个列表之间拖放
【发布时间】：2012-07-11 12:52:34
【问题描述】：

我有三个使用 Jquery UI 的可排序列表。 all-colls-list、coll-selected-list 和 coll-grouped-list。他们都可以通过他们的 ID 来识别。

我希望能够在 all-colls-list 和 coll-selected-list 之间拖放，反之亦然 all-colls-list 和 coll-grouped-list，反之亦然

我不想在 coll-selected-list 和 coll-grouped-list 之间拖放。

但我的代码不同意这一点，只允许我在 all-colls-list 和 coll-grouped-list 之间切换，反之亦然。任何帮助将不胜感激。

我这里有个小提琴：http://jsfiddle.net/noscirre/NkQBy/

var lists = [{
    "listid": "#all-colls-list",
    "connectid": "#coll-selected-list",
    "drop": true
}, {
    "listid": "#coll-selected-list",
    "connectid": "#all-colls-list",
    "drop": true
}, {
    "listid": "#all-colls-list",
    "connectid": "#coll-grouped-list",
    "drop": true
}, {
    "listid": "#coll-grouped-list",
    "connectid": "#all-colls-list",
    "drop": true
}];

$.each(lists, function (i, list) {
    $(list.listid).sortable({
        connectWith: list.connectid,
        dropOnEmpty: list.drop,
        receive: function (event, ui) {
            $("#all-colls-list li").css("background-image", "none");
        }
    });
});

【问题讨论】：

您好，我想我在下面的回答不是您想要的。如果我是对的，请告诉我，我会再试一次

标签： jquery jquery-ui drag-and-drop

【解决方案1】：

问题是您正在覆盖 .sortable connectWith 属性。您需要在单个实例中设置多个目标（或更巧妙地......）

这里是your modified fiddle。我想这就是你所追求的？

希望对您有所帮助！ :)

【讨论】：