jquery-ui - 如何以编程方式调用 jQuery UI Draggable 拖动启动？

Question

我在鼠标处于向下位置之后和释放之前创建了一个新的 jQuery 元素。 (鼠标按下后)。

我想使用 jQuery UI 以编程方式触发新元素上的拖动，以便它会随着我的鼠标移动自动开始拖动。我不想必须松开鼠标然后再次单击鼠标。

我已经尝试过以下...

var element = $("<div />");
element.appendTo("body").draggable().trigger("mousedown");

...但是这不起作用。

有人对如何实现这一目标有任何建议吗？

<小时/>

更新:经过一番搜索 this question 的海报有同样的问题。然而，建议的解决方案归结为......

$("body").on("mousedown", function(e) { 
  $("<div />").draggable().appendTo("body").trigger(e);
});

...在最新版本的 jQuery 和 jQuery-UI 中不再有效，而是生成最大调用堆栈超出错误。

Answer 1

可拖动插件期望其 mousedown 事件使用其 namespace 并指向可拖动对象作为目标。修改事件中的这些字段适用于 jQuery 1.8.3 和 jQuery UI 1.9.2。

$("body").on("mousedown", function(e) { 
  var div = $("<div />").draggable().appendTo("body");
  e.type = "mousedown.draggable";
  e.target = div[0];
  div.trigger(e);
});

此处演示:http://jsfiddle.net/maCmB/1/