如何限制在JS-Plumb的同一個div中建立連接？

Question

這是我Demo in JS Fiddle

HTML

<div id="a" class="a window" style="width: 100px; height: 100px; border: solid 1px"> 
</div> 

JQuery的

var a = $("#a"); 
    var b = $("#b"); 

    //Setting up drop options 
    var targetDropOptions = { 
     activeClass: 'dragActive' 
    }; 

    //Setting up a Target endPoint 
    var targetColor = "#316b31"; 
    var targetEndpoint = { 
     anchor: "TopCenter", 
     endpoint: ["Dot", { radius: 8}], 
     paintStyle: { fillStyle: targetColor }, 
     isSource: true, 
     scope: "green dot", 
     connectorStyle: { strokeStyle: targetColor, lineWidth: 8 }, 
     connector: ["Flowchart", { curviness: 63}], 
     maxConnections: -1, 
     isTarget: true, 
     dropOptions: targetDropOptions 
    }; 

    //Setting up a Source endPoint 
    var sourceColor = "#ff9696"; 
    var sourceEndpoint = { 
     anchor: "BottomCenter", 
     endpoint: ["Dot", { radius: 8}], 
     paintStyle: { fillStyle: sourceColor }, 
     isSource: true, 
     scope: "green dot", 
     connectorStyle: { strokeStyle: sourceColor, lineWidth: 8 }, 
     connector: ["Bezier", { curviness: 63}], 
     maxConnections: -1, 
     isTarget: true, 
     dropOptions: targetDropOptions 
    }; 

    jsPlumb.bind("ready", function() { 

     //Set up endpoints on the divs 
     jsPlumb.addEndpoint($(".window"), targetEndpoint); 
     jsPlumb.addEndpoint($(".window"), sourceEndpoint); 

     jsPlumb.draggable($(".window")); 
     jsPlumb.animate($("#a"), { "left": 50, "top": 100 }, { duration: "slow" }); 
    }); 

查詢 - 如何限制在建立JS-普拉姆在同一格的連接？

Answer 1

我想明智的性能，這是一個更好的辦法。正如您可以決定實際創建連接之前一樣。

jsPlumb.bind("beforeDrop", function(connection) { 
    return connection.sourceId !== connection.targetId; 
}); 

Answer 2

jsPlumb.bind("jsPlumbConnection", function (CurrentConnection) { 
     if (CurrentConnection.connection.targetId == 
              CurrentConnection.connection.sourceId) 
      jsPlumb.detach(CurrentConnection.connection); 
     else 
      init(CurrentConnection.connection); 
    });