0

編集1

メソッド dataTransfer.setData を使用すると、機能します。

http://jsfiddle.net/UH7Sf/1/

d3.event.dataTransfer.setData('type',type);  

d3.event 内でメソッド setData および getData を使用して問題に直面しています

一番上の要素にドラッグ可能な img 要素を配置し、2 つ目の要素にいくつかのドロップ機能を配置する必要があります。

d3.select('img').on('dragstart', function() { 
    var type = d3.select(this).attr('type');
    console.log("Drag starts with "+ type);
d3.event.transfer.setData('type',type);    
});

d3.select('.drop').on('drop', function() {
    d3.event.preventDefault();
    var type = d3.event.transfer.getData('type');
    console.log("Drag ends with "+ type);      
});

d3.select('.drop').on('dragover', function() {
    d3.event.preventDefault();
});

これがフィドルです:http://jsfiddle.net/UH7Sf/

d3 を使用してこれを行う別の解決策 (ドラッグ & ドロップ内でデータを転送する) がありますか?

4

1 に答える 1

0

eventと呼ばれるオブジェクトは内部にありませんtransfer。できることの 1 つは try ですがevent.setData()、ドラッグスタート イベントとドロップ イベントは 2 つの異なるイベント オブジェクトであるため、それも必要だとは思いません。

代わりに、別のローカル変数を使用できます。例えば

var draggedType = null; 

d3.select('img').on('dragstart', function() { 
    var draggedType = d3.select(this).attr('type');
    console.log("Drag starts with "+ draggedType);
});

d3.select('.drop').on('drop', function() {
    d3.event.preventDefault();
    console.log("Drag ends with "+ draggedType);
    // do something with draggedType here

    draggedType = null; // reset draggedType to null when done, just in case
});
于 2013-10-09T18:41:52.190 に答える