4

我正在使用名为 jsPlumb - http://jsplumb.org/jquery/demo.html的 jQuery 插件,我想将我的 jQuery UI 对话框与 jsPlumb 生成的行连接起来。但我想不出办法。

我有这个来源:

<div id="okenko1">Tuhle neco je</div>
<div id="okenko2">Tuhle je neco jineho</div>

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

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

然后我做铅垂:

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

它的窃听:-D 看起来像这样http://prntscr.com/2udde

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

在此处输入图像描述

接下来我尝试探测由 UI 创建的 div,它不起作用......

接下来我能做什么?我真的需要用线连接页面上的两个元素,当我移动其中一个元素时它会移动,但我找不到比 jsPlumb 更好的东西。

4

1 回答 1

3

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

html:

<span id="okenko1">Tuhle neco je</span>
<span id="okenko2">Tuhle je neco jineho</span>

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")

有关可拖动端点的更多信息可以在文档中找到

更新:移动对话框时,示例现在可以工作!

于 2011-08-31T10:06:41.257 回答