Question

我正在尝试使用以下内容来工作，但无法找到正确的方法来使用stop事件。

我有两列你可以从右向左拖动。如果丢弃无效，我的恢复功能正常工作，但如果左列发生有效丢弃，我想删除右列中的项目。我知道条件不正确，但我不确定要查找哪个标志以确定丢弃是否有效。

$("#sortable2 li").draggable({
        connectToSortable: "#sortable1",
        helper: "clone",
        revert: "invalid",
        stop: function (event, ui) {
            if (drop == "valid") 
            { 
               $(this).remove(); 
            }
        }
    });

Answer 1

您可以使用receive

上的.sortable事件处理删除原始元素

example jsfiddle

$("#sortable1").sortable({
    receive: function (event, ui) { // add this handler
        ui.item.remove(); // remove original item
    }
});

$("#sortable2 li").draggable({
    connectToSortable: "#sortable1",
    helper: "clone",
    revert: "invalid"
});

Answer 2

首先，您可以比较event-start和event-stop之间的差异。使用调试器进入事件函数，你可以看到两者之间的区别。

Answer 3

如果您没有对任何内容进行排序，并希望删除原始项目，因为下拉有效，您只需删除helper:"clone"。

$("#sortable2 li").draggable({
    revert: "invalid",
});

jQuery UI draggable - 如果发生有效的删除，则删除克隆

3 个答案: