jQuery, сохраняя исходное положение нескольких перетаскиваемых объектов, чтобы вернуть их обратно

Question

Пожалуйста, смотрите jsfiddle

После того, как я уронил «перетаскиваемый» объект на цель, эта конкретная позиция будет использована в следующий раз при возврате назад.Есть ли способ, с помощью которого я могу сохранить исходные позиции перетаскиваемых объектов и всегда возвращать их обратно к ним (самые первые позиции)?Или есть какое-то иное решение, кроме «сохранения их» для достижения той же цели?

Я обнаружил что-то похожее вопрос , но позиции (слева, сверху) жестко закодированы в них, чтобы вернуться назад,Я очень старался, но не смог найти решение.

Спасибо.

Answer 1

Я предполагаю, что когда вы опускаете перетаскиваемый объект на цель, вы не хотите, чтобы он возвращался, но после того, как вы переместили его обратно за пределы цели, вам бы хотелось, чтобы он вернулся в исходное положение с помощьюостальные перетаскиваемые объекты?

Если это так, то код в этот ответ - это то, что вы ищете, и хотя значения 0, 0 для верхнего и левого местоположений кажутсяжестко запрограммированы, они необходимы, так как атрибуты position CSS draggables устанавливаются в relative после того, как они были превращены в draggables, поэтому при установке их обратно в 0, 0 будет перемещать их обратно вих исходные позиции.

Вот пример jsfiddle , а также модифицированный код в вашем примере:

$('#target').droppable({

    // you need to set revert to a function as the 'out' event is turning it
    // into a function...
    drop: function(event, ui){
        ui.draggable.draggable('option', 'revert', function(){return false});
    },

    out: function(event, ui){
        ui.draggable.draggable('option', 'revert', function(){
            $(this).data('draggable').originalPosition = {
                top: 0,
                left: 0
            };
            return true;
        });
    }
});

Надеюсь, это поможет!Пожалуйста, дайте мне знать, если я полностью пропустил отметку!

Answer 2

Ответ Криса Кемпена правильный, но в более новых версиях jQuery вы можете использовать

$(this).data('ui-draggable')

в обратном вызове "out", поскольку атрибут данных был переименован.