0

私は次のHTMLを持っています

<div class='wraper'> <div class="demo statemachine-demo1"> <div class="w" id="inperson">IN PERSON <div class="ep"></div> </div> <div class="w" id="rejected"> REJECTED <div class="ep"></div> </div> </div> <div class="demo statemachine-demo1"> <div class="w" id="inperson">IN PERSON <div class="ep"></div> </div> <div class="w" id="rejected"> REJECTED <div class="ep"></div> </div> </div> </div>上記の HTML に従って、ラッパー div にはそれぞれ 2 つの div が含まれます .demo div には 2 つの div が含まれ、互いに接続されています .statemachine-demo1 .inperson div から .statemachine-demo2 .inperson(.statemachine-demo1.inperson ----> .statemachine-demo2.inperson) と .statemachine-demo1 .reject から .statemachine-demo2 .reject(.statemachine-demo1.reject -----> .statemachine-demo2.reject).

クラスをドラッグすると結合線が連続的に移動しますが、知りたいのは、親div statemachine-demo1 をドラッグすると、子div reject と inperson クラス div も結合線に沿って連続的に移動する必要があることです。

4

1 に答える 1

0

このためには、親 div に jsPlumb.draggable() を使用する代わりに、カスタマイズされた jquery ドラッグ可能関数が必要です。親 div をドラッグするたびに、子のいずれかに接続があるかどうかを確認する必要があります。接続がある場合は、それらの接続を再描画する必要があります。コード：

$('.demo').draggable({ // considering parent div has 'demo' class as in your case
        drag:function(event){
            // on drag check any child has connections and repaint them
            $(this).find('._jsPlumb_endpoint_anchor_').each(function(i,el){
                   jsPlumb.repaint($(el));
            });                 
        }
});
于 2014-07-31T03:49:47.017 に答える