jQuery drag & drop: клонированные перетаскиваемые движения оригинальные

У меня проблема с Drag & Drop in jQuery. В моем коде есть перетаскиваемый div. Когда я перемещаю его в определенную ячейку таблицы droppable, клон ячейки добавляется к ячейке таблицы. Но когда я перетаскиваю клон, исходный div перемещается. Это вот функция, которая называется drop:jQuery drag & drop: клонированные перетаскиваемые движения оригинальные

function(event, ui) 
{ 
    var draggable = ui.draggable.clone(true); // cloning including attrs and children 
    draggable.draggable(); // this is something I tried with no effect 
    $(this).empty(); // empty the droppable cell 
    $(this).append(draggable); // append the div to the cell 
}

Я не нашел ясного ответа от Google. Я не знаю, имеет ли это какое-либо отношение к этому, но div имеет относительную позицию (и должен оставаться таким образом).

Как я могу убедить, что клон можно перетащить так же, как его оригинал?

источник

2011-04-06 RemiX

Может ли клонировать атрибут id и его исходный элемент? Это, скорее всего, вызовет странные проблемы. –

@Andrew: Да, он клонирован вместе с ним, но мне не нужен атрибут id для draggable. Я использую другой селектор jquery на основе пользовательского атрибута ('[drag = article]'). – RemiX

Вот как бы я это сделал, это должно сделать трюк.

$(".draggable").draggable({ helper: 'clone' }); 
$(".droppable").droppable({ 
    drop: function (event, ui) { 
     ui.draggable.clone().appendTo($(this)).draggable(); 
    } 
});

Я не знаю, если вы сделали, но не использовать ID-ы на перетаскиваемом, вызывает те собираются клонировать тоже. Кроме того, вы должны добавить элемент перед применением перетаскиваемого на нем.

источник

2011-04-06 16:03:34 rucsi

Спасибо! Это работает. Возможно, большая разница заключается в использовании appendTo на клоне, вместо того, чтобы использовать append из droppable. Был бы также способ клонировать перетаскиваемые свойства клону? Потому что теперь новый draggable не имеет помощника, и я не хочу его жестко кодировать. – RemiX

Нашел свой собственный ответ на этот комментарий: ui.draggable.draggable ('option') копирует все параметры текущего перетаскиваемого. – RemiX

Вы посмотрели на Helper Option?

источник

2011-04-06 15:13:31 StuperUser

Да, я использовал хелпер: «clone», но дело не в перетаскивании, а в клонировании фактического элемента при удалении. – RemiX

Вы пробовали передать ложь в .clone()? Этот bool означает withDataAndEvents, поэтому вы наследуете все те же события, которые также привязаны к старому объекту.

Редактировать: если вам нужно с помощью DataAndEvents по другим причинам, вы можете попробовать использовать draggable («destroy») в оригинале прямо перед тем, как сделать клон, а затем перетащить его снова? Не самый элегантный, но он работает: http://jsfiddle.net/GheD5/

источник

2011-04-06 15:15:06

Да, я попытался использовать false в методе clone, но мне нужны дочерние элементы и атрибуты, чтобы они были одинаковыми, поэтому я использую true. Спасибо, я попробую отредактированное замечание. – RemiX

Можете ли вы показать полный код? Я просто догадываюсь, но использование «delegate()» http://api.jquery.com/delegate/ может стать ключом к вашему решению.

источник

2011-04-06 15:18:07

Я не вижу, как я должен использовать делегат прямо сейчас, но я думаю, что у меня уже есть решение благодаря rucsi. Но спасибо. – RemiX

Изменение кода draggable инициализации включить helper: "clone"

$("selector").draggable({ 
     ... 
     helper: "clone", 
     ... 
});

В противном случае вы тянете исходный элемент, который просто получает влево, где вы закончили операцию перетаскивания.

источник

2011-04-06 15:21:09

Да, у меня это есть. Если я перетаскиваю клон, оригинал перетаскивается из его начального положения. – RemiX

jQuery drag & drop: клонированные перетаскиваемые движения оригинальные

ответ

Смежные вопросы