Question

我有一个问题，我或多或少使用jsPlumb流程图演示示例，但每个窗口只有一个放置目标，并且可能有一个或多个拖动目标。但是，我想禁止自我连接，以便可以将连接从任何窗口拖动到任何其他窗口除外。

我在想，也许你会使用范围，但这意味着每个窗口的范围不同，这似乎超过了顶部。有没有人有一个整洁的解决方案？

Answer 1

感谢他们的答案，他们指出了我正确的方向。最后使用＆＃34; beforeDrop＆＃34; 当绑定＆＃34;连接＆＃34;它正在分离窗口的源端点以及连接。

最终解决方案是：

instance.bind("beforeDrop", function (info) {
// console.log("before drop: " + info.sourceId + ", " + info.targetId);
    if (info.sourceId === info.targetId) { //source and target ID's are same
        console.log("source and target ID's are the same - self connections not allowed.")
        return false;
    } else {
        return true;
    }
});

Answer 2

来自http://www.jsplumb.org/doc/connections.html#draganddrop

防止环回连接

仅在vanilla jsPlumb中，您可以指示jsPlumb防止环回连接，而不必求助于beforeDrop拦截器。您可以通过在传递给makeTarget方法的参数上设置allowLoopback：false来执行此操作：

jsPlumb.makeTarget("foo", {
  allowLoopback:false
});

Answer 3

绑定事件以在创建新连接时收到通知。创建连接后，检查连接的源和目标是否相同，如果是，则断开该连接以避免自循环。代码：

jsPlumb.bind("jsPlumbConnection", function(ci) {

            var s=ci.sourceId,c=ci.targetId;

            if( s===c ){ //source and target ID's are same
                jsPlumb.detach(ci.connection);
            }
            else{ // Keep connection if ID's are different (Do nothing)
                // console.log(s+"->"+c);
            }
        });

JsPlumb流程图没有自我连接

3 个答案: