JavaScriptのHTML5：Gmailのようなアップロードインターフェースのためのドラッグアンドドロップの問題

Question

私のインターフェイスのスクリーンショット：

ツリーの各要素は<li>と<a>です。

各フォルダは、gmailのアップロードドラッグアンドドロップのようなファイルアップロードのドロップゾーンです。

私は私のマシンからのファイルとフォルダを「ドラッグ入力してください」、私はスタイルを追加：

このためコード：

var dropZoneElement = document.getElementById($this.attr('id')); 

dropZoneElement.addEventListener('dragenter', onDragEnter, false); 
dropZoneElement.addEventListener('dragleave', onDragLeave, false); 
dropZoneElement.addEventListener('drop', onDrop, false); 

function onDragEnter(event) { 
    event.preventDefault(); 
    event.stopPropagation(); 
    $this.addClass('gmail-like'); 
} 

function onDragLeave(event) {...} 
function onDrop(event) {...} 

しかし、問題はありますフォルダ（<a>）をフォルダにドラッグすると（偽のリンクtestのデスティネーションがない場合はスクリーンショットを参照）、アップロードするスタイルを追加します（アップロードしないで、表示するだけです）。

• なぜ？
• これを無効にする方法はありますか？

このスタイルは、自分のマシンからファイルをドラッグアンドドロップする場合にのみ適用されます。

Answer 1

基本的には、drag data item kindを確認し、それが実際にはファイルであり他のものではないことを確認する必要があります。また、無効にすることができます

&ドロッププロセスを説明しているHTML5 draftをご覧ください。 This tutorialも役立つかもしれません。

最後に、following SO質問には具体的なヒントがあります。