使用JsPlumb将jQuery UI对话框与行连接

我正在使用名为jsPlumb的jQuery插件 – http://jsplumb.org/jquery/demo.html ，我想用jsPlumb生成的行连接我的jQuery UI对话框。 但我无法弄清楚这样做的方法。

我有这个来源：

Tuhle neco je
 
Tuhle je neco jineho 

当我使用jQuery UI从这个div创建对话框时

 $("#okenko1").dialog()... 

然后我做了铅垂：

 jsPlumb.connect({source: $("#okenko1"), target: $("#okenko2")}); 

它的错误:-D看起来像这个http://prntscr.com/2udde

我试图扭转这个过程，首先检查em然后使用对话框，结果在这里http://prntscr.com/2udef ：

接下来我试图检测由UI创建的div，它不起作用……

我接下来该怎么办？ 我真的需要在页面上用线连接两个元素，当我移动其中一个元素时它会移动，但我找不到比jsPlumb更好的东西。

Answer 1

我在jsfiddle中做了一个小样本： http ： //jsfiddle.net/p8XUm/4/

HTML：

 Tuhle neco je Tuhle je neco jineho 

JavaScript的：

 var d = $("#okenko1").dialog({drag: function(event, ui){ jsPlumb.repaint(d); }}).parent('.ui-dialog'); jsPlumb.connect({source: $("#okenko2"), target: d}); 

您应该使用父对话框元素作为铅垂端点，而不是div本身。 d = $("#okenko1").parent(".ui-dialog")

有关可拖动端点的更多信息，请参阅文档

更新：示例现在可以在移动对话框时工作！