Ручной запуск событий перетаскивания jQuery для элемента DOM - PullRequest
Новая
       17

Ручной запуск событий перетаскивания jQuery для элемента DOM

0 голосов
/ 02 июня 2019

У меня следующая проблема при работе с перетаскиваемыми элементами в jQuery.Допустим, у меня есть следующая структура: 

<body>
<div id="drag1">John Doe</div>
<div id="drag2">Peter Griffin</div>
<div id="drop1"></div>
</body>

Кроме того, у меня есть следующий код Javascript: 

$('#drag1').draggable({});
$('#drag2').draggable({});

$('body').droppable({
    drop: function (event, ui) {
          // Move the element.
          $(ui.draggable).detach.appendTo($(this));
          }
    });
$('#drop1').droppable({
    greedy: true,
    drop: function (event, ui) {
          // Move the element.
          $(ui.draggable).detach.appendTo($(this));

          // Dropped.
          console.log("dropped to div");
          },
     out: function (event, ui) {
          // Going out.
          console.log("out from div");
          }
     });

С этим кодом (плюс немного CSS) я могу перетащить оба элемента divс помощью мыши, чтобы перетащить div, а также переместить их из drop div без проблем.В моем производственном коде события «drop» и «out» также запускают чтение / запись базы данных, так что я могу сохранить, какие элементы уже были сброшены в div.

Идея состоит в том, что при перезагрузкесайте, я хотел бы восстановить ранее удаленные элементы и поместить их в соответствующий элемент.Для этого я перебираю записи в базе данных и перемещаю div перетаскивания вручную из родительского тела в div сброса следующим образом: 

$('#drag1').detach.appendTo('#drop1');

Теперь я обнаружил, что этот метод не вызывает событие dropкапли див.Однако это не проблема, так как я уже знаю, что этот конкретный перетаскиваемый объект уже удален, а значения находятся в базе данных.Фактическая проблема заключается в том, что, поскольку элемент не был УДАЛЕН в элементе drop drop, а только структурно перемещен в него, событие OUT не вызывается, когда я перемещаю элемент drag с помощью мыши из элемента drop drop.Это, конечно, приводит к несоответствиям в базе данных.

Следовательно, мой вопрос заключается в том, как я могу сказать jQuery, что в выпадающем элементе div есть элементы, которые нужно отслеживать на предмет событий out?

Большое спасибо!

...