javascript - 拖放后销毁可拖动对象时出错

Question

当我尝试在删除可拖动对象后销毁它时，我在 jQuery UI 中收到错误消息。我正在使用 jQuery 1.9.1 和 jQuery UI 1.10.0。

脚本

$(".drag").draggable({
    revert: "invalid",
    helper: "clone"
});

$(".drop").droppable({
    accept: ".drag",
    drop: function(event,ui){
      ui.helper.remove();
      $(this).append(ui.draggable);
      $(ui.draggable).draggable("destroy");
    }
});

HTML

<div class="drag">Draggable</div>
<div class="drop">Droppable</div>

示例: http://jsfiddle.net/feDME/

收到错误

TypeError: $(...).data(...) is undefined

在过去的几个小时里，我一直在做这件事，但没有成功。我发现了一个类似的帖子，但没有包含决议。有人可以帮我从这里出去吗？谢谢!

Answer 1

jquery-ui 可拖动代码中似乎存在竞争条件，它会在拖动停止时尝试设置光标。以下行失败，因为调用停止时“可拖动”数据尚未附加到可拖动 div。

var o = $(this).data('draggable').options;

这有点麻烦，但这个 setTimeout 会解决它。

$(".drop").droppable({
    accept: ".drag",
    drop: function(event,ui){
      ui.helper.remove();
      $(this).append(ui.draggable);
      setTimeout(function() {
          $(ui.draggable).draggable("destroy");      
      }, 0);      
    }
});