向后移动时可拖动元素覆盖另一个元素

Posted 2023-05-08

【中文标题】向后移动时可拖动元素覆盖另一个元素

【英文标题】：Draggable element covers another one when moving back

【发布时间】：2011-11-27 16:54:57

【问题描述】：

目前我在http://jsfiddle.net/nivea75ml/yCnh5/ 的演示中遇到了一个小问题。 每当我将一个粉红色框从列表中拖到灰色区域并稍后将其移回时，它会覆盖同一列表中的另一个。

如何避免这种行为？

【问题讨论】：

阅读：***.com/questions/811037/…

@Edd，您能否详细说明我的示例中存在哪些问题？

抱歉，我想我的错，我不记得了.. 好在现在可以了。

【参考方案1】：

可拖放和排序

$('#draggableList').sortable(
    receive: function(event, ui) 
        var item = $('.ui-draggable-dragging');
        item.removeAttr("style");
        item.removeAttr('class');
        item.addClass('draggable');
    
);
var $tab_items = $("#droppable").droppable(
    //accept: ".draggable",
    hoverClass: "ui-state-hover",
    drop: function(event, ui) 
        var item = $(this);

        var olditem = $(".draggable.ui-sortable-helper").clone();
        if (olditem[0] != null) 
            olditem.removeAttr('class');
            olditem.addClass('dragged');

            olditem.css(
                'position': 'absollute',
                'top': ui.offset.top,
                'left': ui.offset.left
            );
            olditem.draggable(
                connectToSortable: "#draggableList",
                helper: "original",
                revert: 'invalid'
            );

            ui.draggable.remove();
            $('#droppable').append(olditem).show("slow");
        

    ,
    out: function(event, ui) 
);

http://jsfiddle.net/yCnh5/25/