jsPlumb：拖动新连接应删除现有连接

使用 jsPlumb，我设法进行了以下设置：

• 有多个节点，其作用类似于特殊类型流程图中的节点。
• 每个节点都有一个可以将连接丢弃到的目标。
• 每个节点都有零个、一个或多个出口。每个出口作为jsPlumb源，最多允许有1个连接。

先举个小例子：http://fiddle.darkspot.ch/ivr/flowchart/ivrplumb.html http://fiddle.darkspot.ch/ivr/flowchart/ivrplumb.html（经过一个小时的尝试，不幸的是我没有让它在 jsFiddle 上运行 - 所以我自己托管它）

我想要实现的是： 如果用户将新连接从出口拖动到另一个节点，则应按预期建立该连接。但该出口上的所有其他连接都应删除。

我尝试了不同的方法：

• 有一个click听众 http://jsplumbtoolkit.com/doc/events#evt-connection（链接到 jsPlumb 文档）每个退出气泡。不起作用 -> 无论我尝试什么，该事件都不会被触发。
• 有实例connection听众 http://jsplumbtoolkit.com/doc/events#endpointEvents。我想我可以从端点中获取现有连接info我收到的对象。边看例子边打开控制台，你会发现它总是1，无论有多少个连接。
• 限制maxConnections为了makeSource(...)拨电至1。这实际上可行，但用户无法拖动另一个连接来替换第一个连接。

重现步骤：

1. 将鼠标移至橙色方块之一，单击并将连接拖动到另一个节点。 （应建立连接）
2. 打开浏览器的 JavaScript 控制台
3. 将鼠标移动到同一个方块，然后单击/拖动另一个连接到同一个或另一个目标节点。 （第二个连接应该建立。观察控制台打印Number of connections:1。这应该是2 here)

我究竟做错了什么？

在建立新连接之前，检查源是否已经有传出连接，如果有则删除它。假设退出元素有exit class:

jsPlumb.bind('beforeDrop', function(ci){ // Before new connection is created
    var src=ci.sourceId;
    var con=jsPlumb.getConnections({source:src}); // Get all source el. connection(s) except the new connection which is being established 
    if(con.length!=0 && $('#'+src).hasClass('exit')){
        for(var i=0;i<con.length;i++){
            jsPlumb.detach(con[i]);
        }
    }
    return true; // true for establishing new connection
});