如何删除jsPlumb连接

I am playing with jsplumb, but I am not able to delete the connection between two divs having only the id of one div.


 

If you've multiple connections from or to elements, detaching all connections is maybe not the best solution to delete a connection. There is a (not well documented) function to detach exactly one connection:

jsPlumb.detach(connection, {
    fireEvent: false, //fire a connection detached event?
    forceDetach: false //override any beforeDetach listeners
})

In my example, I want to delete a connection when the connector is clicked:

 jsPlumb.bind('click', function (connection, e) {
     jsPlumb.detach(connection);
 });

 

2017年10月01日57分04秒

 

I found the solution in the documentation (http://jsplumb.org/doc/usage.html)

jsPlumb.detachAllConnections("elementId");

2017年10月01日57分04秒

 

If source div or target div id is already known, then you can delete the connection like this:

var conn = jsPlumb.getConnections({
              //only one of source and target is needed, better if both setted
              source: sourceId,
              target: targetId
            });
if (conn[0]) {
  jsPlumb.detach(conn[0]);
}

You can also use jsPlumb.getAllConnections() to get the array of all connections, and test every connection's sourceId or targetId to get exactly the connection you need;

2017年10月01日57分04秒

 

After all the endpoint connections, to and from the element are deleted, you need to detach it as shown in the 3rd line

jsPlumb.detachAllConnections(divID);
jsPlumb.removeAllEndpoints(divID);
jsPlumb.detach(divID); 
divID.remove()

2017年10月01日57分04秒

 

Hi you can refer to this: Detach connection jsPlumb

This block of code allows to detach connection if a connection was clicked:

jsPlumb.bind("click", function(conn) {
    jsPlumb.detach(conn);
});

2017年10月01日57分04秒

 

This code removes all "wrong" connections in a game I'm developing. I hope it helps

var wrong_connections = new Array(DB_ID, ANOTHER_DB_ID);
var connections = jsPlumb.getConnections();
$.each(connections, function(index, value) { // going through all connections
  var source_id = value.source.attr('id').substring(28);  // I need the ID from DB so I`m getting it from the source element
  for (var a = 0; a < wrong_connections.length; a++) {  
    if (source_id == wrong_connections[a]) {
      jsPlumb.detach(value);
    }
  }
});

2017年10月01日57分04秒

 

jsPlumb.deleteConnectionsForElement(elementId)

works. Though it's old I'd like to add that finding out what methods a library has, provided it's self descriptive enough is quite easy.

原文地址:https://www.cnblogs.com/ysx215/p/7615684.html