如果图像已被删除,请禁用图像丢弃?

时间:2013-04-05 12:30:50

标签: jquery drag-and-drop jquery-ui-draggable jquery-ui-droppable

我有同样的问题,比如 我有两个div标签,我想从动态创建的图像列表中拖动图像。 但我想限制另一个图像在同一个div上拖动。

Disable drop if div has already been dropped?

我使用了Jamiec在其答案中讲述的方法。

但是,继承人问题我得到了一个我无法解决的错误

  

未捕获的TypeError:无法设置未定义的属性'originalPosition'

请有人帮我删除此错误。

1 个答案:

答案 0 :(得分:0)

选项:#1

请查看演示。如果已经有一个元素掉落在droppable上,则元素将始终恢复到原始位置。

$('#target').droppable({
    accept: ".dragme",
    drop: function(event, ui) {
       ui.draggable.addClass('dropped');
       ui.draggable.draggable( "disable" );
      $('#target').droppable( "option", "accept", "" );
    }
});

$('.dragme').draggable({
    revert : 'invalid'
});

<强> DEMO

选项:#2

这是另一个演示,当一个新元素被删除时,现有的被删除的元素将恢复到它的原始位置。

var droppedObj = null;
$('#target').droppable({
    accept: ".dragme",
    drop: function (event, ui) {
        if(droppedObj !== null) {
            droppedObj.animate({ left: '0px', top : '0px', opacity : 1 }, 200).removeClass('dropped');
            droppedObj.draggable("enable");
        }
        droppedObj = ui.draggable;
        ui.draggable.addClass('dropped').draggable("disable");
    }
});

$('.dragme').draggable({
    revert: 'invalid'
});

<强> DEMO