jsplumb添加元素,容器可拖动,元素不可拖动

jsplumb add elements, container draggable, elements not

本文关键字:拖动 元素 添加 jsplumb      更新时间:2023-09-26

我正在使用jsplumb,并试图创建一个场景,当用户单击按钮时,将创建4个元素,并且可以使用jsplump进行连接。我试图使容器可拖动,而不是可连接的元素。

在我的小提琴里。我希望灰色区域框(id=container_1)是可拖动的。

Fiddle

var a = 0;
var field = "";
$('#addField').click(function(){
    a++;
    var container = "<div class='container' id='container_"+a+"'></div>";
    $('#body').append(container);
    for (i=1;i<=9;i++){
        field = '<div class="item" id="entry_'+a+'_action_'+i+'">Text</div>';   
        $("#container_"+a).append(field);
            jsPlumb.ready(function() {
                var id = 'entry_'+a+'_action_'+i;
                jsPlumb.makeSource($('#'+id), {
                    connector: 'StateMachine'
                });
                jsPlumb.makeTarget($('#'+id), {
                    anchor: 'Right'
                });
            });
        }
    })
});

您需要一个自定义jquery可拖动:

$('#container_'+a).draggable({ 
    drag:function(event){
            jsPlumb.repaintEverything();
    }

});

荣誉https://stackoverflow.com/users/2905527/pruthvi-bharadwaj