Question

我正在div中添加由另一个div拖动的项目现在我想要当项目从所选项目div中拖动时如果它在同一个div中然后它还原或排序但是如果我们从所选项目div拖动并从其他地方删除然后它也从所选项目div中删除

基本上我想在选择项目后添加删除选项

为了更好地理解这是jsfiddle

$(document).ready(function(){
    items = $('#items');
    selection = $('#selection');

    // selected items is sortable also

    selection.sortable({
        item: "li",
        containment: "document"
    });

//above div dragable
$('#items  li').draggable({
    revert: "invalid",
    containment: "document",
    appendTo: "body",
    helper: "clone"
 });    

//below div dropable
selection.droppable({
    accept: ":not(.ui-sortable-helper)",
    drop: function( event, ui ) {
        $( "<li class='sortable-item' data-name='"+ui.draggable.attr('data-name')+"'></li>" ).text( ui.draggable.text() ).appendTo(selection);

    }
}).sortable({
    items: "li",
    containment: "document"
   });
});

Answer 1

我认为你想要的是什么。您正在从所选的一个中创建一个新的li。我想你想把它分开并将它附加到底部div。即使你有数据附加到元素，你将保留它，你不必担心数据名称问题。

//below div dropable
    selection.droppable({
        accept: ":not(.ui-sortable-helper)",
        drop: function( event, ui ) {
            $(ui.draggable).detach().appendTo(selection);
        }
    }).sortable({
        items: "li",
        containment: "document"
    });

使用jquery从div中删除li

1 个答案: