0

如果拖动元素与任何可拖动元素相交,我想让拖动的项目恢复旧位置。有什么想法吗?

                $( "#MainContents div[name=draggable]" ).each(function() {
$( this ).draggable({containment: 'parent',
  scrollSpeed: 1000,
  cursor: "crosshair",
   scroll:true,
 disabled: DragDropState,
stop: function(event, ui) {
        var Stoppos = $(this).position();
        var parentPosition=$(this).parent().position();
        var CalculatedTop=Stoppos.top-parentPosition.top;
        var CalculatedLeft=Stoppos.left-parentPosition.left;
        }
    });
});
4

1 回答 1

1

您需要在拖动开始时记录它的来源,然后在拖动停止时检查覆盖。看看这个jsfiddle 例子

简而言之,扩展您的可拖动选项数组以包括开始,记录数据对象中的顶部/左侧位置,然后在停止时检查 DOM 中的其他可拖动项目,如果有任何匹配项,则调用还原函数。

前任:

$( this ).draggable({
start: function() {
  var div = $(this);
        div.data('top', div.css('top'));
        div.data('left', div.css('left'));
},
containment: 'parent',
  scrollSpeed: 1000,
  cursor: "crosshair",
   scroll:true,
 disabled: DragDropState,
stop: function(event, ui) {
        var draggables = $('.ui-draggable');
        var div = $(this);
        var goHome = function () {
            div.css('left', div.data('left'));
            div.css('top', div.data('top'));
        };

        draggables.not(div).each(function () {
            var curr = $(this);
            var currPos = curr.position();
            var divPos = div.position();
            if (divPos.left >= currPos.left && divPos.left <= (currPos.left + curr.width())) {
                if (divPos.top >= currPos.top && divPos.top <= (currPos.top + curr.height())) {
                    goHome();
                }
            }
        });
    };
});

我很确定这样的事情就是你想要做的。顺便说一句,从这里您可以为还原功能设置动画,以便它优雅地回到上次的位置。

于 2013-07-30T12:01:59.743 回答