HTML5のドラッグ＆クローム

Question

で焼成ないは、OnDblClickドロップは

、私は私の非常に単純なコードで構成されていhttp://jsfiddle.net/G9mJw/をするためにクロム11で焼成されていない、ここで、この単純な例があります：

var dropzone = document.getElementById('dropzone'), 
    draggable = document.getElementById('draggable'); 


function onDragOver(event) { 
    var counter = document.getElementById('counter'); 
    counter.innerText = parseInt(counter.innerText, 10) + 1; 
} 


dropzone.addEventListener('dragover', onDragOver, false); 

Safariで正常に動作するようですtho ...しかし、クロムではイベントは呼び出されていません。

これは現在クロムで動作しているいくつかの例を複製しようとしましたが、私にとってはうまくいきません。

動作しても表示されるようにデフォルトの動作を防止しようとしましたが、動作しませんでした。任意のヘルプは非常に高く評価されるだろう。

おかげ

Answer 1

ドロップゾーンに発射されるようにdragoverイベントのdragstartイベントでドラッグ可能な要素にいくつかのデータを設定するために必要であると思われます。

クロムでも機能するスニペットhttp://jsfiddle.net/G9mJw/20/を更新しました。

と新しいコードは次のように：

var dropzone = document.getElementById('dropzone'), 
    draggable = document.getElementById('draggable'); 


function onDragStart(event) { 
    event.dataTransfer.setData('text/html', null); //cannot be empty string 
} 

function onDragOver(event) { 
    var counter = document.getElementById('counter'); 
    counter.innerText = parseInt(counter.innerText, 10) + 1; 
} 

draggable.addEventListener('dragstart', onDragStart, false); 
dropzone.addEventListener('dragover', onDragOver, false); 

また、これはでどのように機能するかについてのいくつかのより多くの情報があります：ドラッグが発生した場合

、データは次の条件を満たす必要があります。 https://developer.mozilla.org/En/DragDrop/Drag_Operations#Drag_Dataとは次のように、この言及するものドラッグされているものを識別するドラッグに関連付けられます。理解しやすくする

... 私は、これはいくつかのデータを送信することなく、Safariで動作するんどのように把握しようとしていますか？それとも既定のコンテンツが既に送信されているのでしょうか？

また、event.dataTransfer.setData('text/html', null);メソッドは、奇妙なことにevent.dataTransfer.setData('text/html', '');のような空の文字列を送信できません。そうしないと、dragoverイベントはディスパッチされません。

Answer 2

現在のところ、Chromeではいくつかのデータタイプしかサポートされていません。データに認識されたMIMEタイプがない場合、ドラッグ/ドロップは続行されません。これは非常に明確にW3C仕様に違反しており、Firefoxの場合は問題ありません（の一部のデータをソートしている）かSafari（データが設定されているかどうかにかかわらずドラッグを続けることができます）。

クロムバグレポートはこちらです：http://code.google.com/p/chromium/issues/detail?id=93514

Answer 3

私はmimeタイプとのトラブルがありました。

W3Schoolsのは、あなたが試すことができますページがあります。 http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_draganddrop2

私が代わりに「テキスト」の「text/htmlの」とのgetDataとsetDataメソッドを変更するまで、彼らのコードサンプルは私のために動作しないでしょうし。

私が使用しています： バージョン34.0.1847.116のUbuntu 14.04オーラ（260972）