jQuery:Как предотвратить удаление помощника, если он не был успешно удален
-
03-07-2019 - |
Вопрос
у меня есть draggable
с обычаем helper
.Иногда помощником является клон, а иногда — исходный элемент.
Проблема в том, что когда помощник является исходным элементом и нет упал на действительный dropable, он будет удален.Мое решение пока выглядит так:
в моем on_dropped
обратный вызов я установил ui.helper.dropped_on_droppable
к true
;
в stop
обратный вызов перетаскиваемого объекта, я проверяю эту переменную, а затем...что мне делать?
$('.my_draggable').draggable({
stop : function(e, ui) {
if (!ui.helper.dropped_on_droppable) {
/* what do I do here? */
}
},
Это вообще правильный подход?
Решение
Хорошо, я нашел решение!Это уродливо и нарушает «правила инкапсуляции», но, по крайней мере, выполняет свою работу.
Помнить это только для особых случаев!jQuery прекрасно справляется с удалением собственного помощника.В моем случае у меня был помощник, который иногда был исходным элементом, а иногда и клоном, поэтому не всегда было целесообразно удалять помощника после возврата.
element.draggable({
stop : function(e, ui) {
/* "dropped_on_droppable" is custom and set in my custom drop method
".moved_draggable" is custom and set in my custom drag method,
to differentiate between the two types of draggables
*/
if (!ui.helper.dropped_on_droppable & ui.helper.hasClass('moved_draggable')) {
/* this is the big hack that breaks encapsulation */
$.ui.ddmanager.current.cancelHelperRemoval = true;
}
},
Предупреждение:это нарушает инкапсуляцию и может быть несовместимо с прямой совместимостью.
Другие советы
Возможно, я здесь что-то упускаю, но разве это не просто добавление
revert: "invalid"
к параметрам перетаскиваемого объекта, если перетаскиваемый элемент представляет собой оригинальный элемент, а не клон?
Я использую специальный помощник, который объединяет перетаскиваемые объекты с множественным выбором в один элемент div.Кажется, это не соответствует функции возврата, поэтому я придумал эту схему.Элементы вручную добавляются обратно к исходному родительскому элементу, который я отслеживаю с помощью .data().
.draggable({
helper: function() {
var div = $(document.createElement('div'))
.data('lastParent', $(this).parent());
return div;
},
start: function() {
//... add multiple selection items to the helper..
},
stop: function(event,ui) {
$( $(ui.helper).data('lastParent') ).append( $(ui.helper).children() );
}
}
Этот подход теряет красивую анимацию, но может быть полезен вам или кому-то еще, столкнувшемуся с этой проблемой.