Javascriptドラッグアンドドロップ：ドラッグが成功した後にドラッグされた要素を削除する

Question

ネイティブのAPIをドラッグ＆ドロップの APIをjavascriptに使用しています。ドロップが成功した後、DOMからドラッグされた要素を削除するにはどうすればよいですか？

• 私はドロップイベントを聞いてみたが、これが唯一の上に滴下し、ドラッグされている要素への参照を持っていない要素にトリガーされます。
• 私はdragend要素を聞いてみましたが、これでドロップが成功したかどうかわかりません。
• グローバル変数にドラッグされている要素を格納しないようにしようとしています。異なるタブまたはブラウザ間でドラッグが発生すると問題が発生します。

ここでは例です：http://jsfiddle.net/KNG6n/3/

ボックスにドラッグすることができる文字のリスト。手紙のノードがボックスにドロップされたら、リストから削除したい（同じ文字を含む他のリスト項目に影響を与えないで）

Answer 1

dragendイベントイベントをリッスンし、ドラッグされた要素で何かを行う前に、dataTransferオブジェクトのdropEffectプロパティ変数を確認してください：にドラッグされている

htmlElement.addEventListener('dragend', function(event){ 
    if(event.dataTransfer.dropEffect !== 'none'){ 
     $(this).remove(); 
    } 
}); 

Answer 2

これを1つの方法として、範囲外の変数に割り当てることができますdragstartを呼び出し、ドロップしたときにその要素を使用します。

See this fiddle.

Answer 3

また、この例を見てみましょう：http://html5demos.com/drag

VARエル=のdocument.getElementById（e.dataTransfer.getData（ 'テキスト'））;

el.parentNode.removeChild(el);