zoukankan      html  css  js  c++  java
  • 如何删除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.

  • 相关阅读:
    C#中的abstract、virtual、interface关键字
    tsql字符串截取
    C# byte换算
    apple-mobile-web-app-capable
    Content-Security-Policy
    sqlserver建立连接服务器
    20 ViewPager Demo4自动轮播
    20 ViewPager Demo3指示器
    20ViewPager demo1,2:接收ViewPager展示View的使用
    有没有最好的学习Angularjs2的视频入门体验?
  • 原文地址:https://www.cnblogs.com/ysx215/p/7615684.html
Copyright © 2011-2022 走看看