首页 > 编程语言> > javascript – JsPlumb – 在draggable元素上使用时,端点不刷新位置

javascript – JsPlumb – 在draggable元素上使用时,端点不刷新位置

2019-08-26 21:35:17 作者：互联网

我开始使用jsPlumb和JQuery,我想连接可拖动的元素但是如果我添加了
连接之前的可拖动行为然后连接不刷新位置.

我的代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
        <title></title>

        <style type="text/css">
            .window {
                background-color: white;
                border: 3px solid #346789;
                color: black;
                font-family: helvetica;
                font-size: 0.8em;
                height: 12em;
                opacity: 0.8;
                padding: 0.5em;
                position: absolute;
                width: 14em;
                z-index: 20;
            }
        </style>

        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript" src="jquery-ui.min.js"></script>
        <script type="text/javascript" src="jquery.jsPlumb-1.3.2-all-min.js"></script>
    </head>
    <body>
    <div>
        <div id="a" class="a window" style="width: 100px;height: 100px;border: solid 1px"></div>
        <div id="b" class="b window" style="width: 100px;height: 100px;border: solid 1px;"></div>
    </div>
    <script type="text/javascript">

        $(document).ready(function() {

            $(".window").draggable();

            var a = $("#a");
            var b = $("#b");
            jsPlumb.connect({
                source:a,
                target:b,
                connector:["Bezier",68],
                endpoints:[
                    ["Dot",{radius:12}],
                    ["Rectangle",{width:20,height:30}]
                ]
            });
        });
    </script>
    </body>
    </html>

解决方法:

我写了jsPlumb.

它没有刷新的原因是它无法知道被拖动的东西.而不是调用$(“.window”).draggable(),您需要让jsPlumb在建立连接时为您执行此操作,或者通过此方法：

jsPlumb.draggable($() “的窗口.”);

第一个选项不会初始化任何没有连接的窗口的拖动.第二个会.

标签：jsplumb,javascript,jquery
来源： https://codeday.me/bug/20190826/1733954.html