jsplumb添加元素，容器可拖動，元素不是

Question

我正在使用jsplumb並試圖創建一個方案，當用戶單擊按鈕時，將創建4個元素並使用jsplumb進行連接。 我想讓容器可拖動，而不是可連接的元素。

在我的小提琴。我希望灰色區域框（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' 
       }); 
      }); 
     } 
    }) 

}); 

Answer 1

你需要一個定製的jQuery可拖動：

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

}）;

kudos to https://stackoverflow.com/users/2905527/pruthvi-bharadwaj