drag me

DataTransfer.setData of drag & drop not working in chrome?

<div id="asd" title="222">drag me</div> <script> var el = document.getElementById("asd"); el.draggable=true; el.addEventListener("dragstart", function(ev){ ev.stopPropagation(); var dt = ev.dataTransfer; dt.effectAllowed = "copyMove"; console.log(this.getAttribute("title") + " attr"); dt.setData('Text', this.getAttribute("title")); console.log(dt.getData('Text') + " dt"); },false); </script> 

FIDDLE:

http://jsfiddle.net/vwjCa/

http://jsfiddle.net/vwjCa/2/ (here a non-standard type is used instead of text)

in firefox reports:

 222 attr 222 dt 

in chrome prints:

 222 attr dt 

where is the problem? thank you in advance

+4
source share
2 answers

answering myself:

Apparently, chrome allows you to read data transfer data only in the drop event.

this is for security reasons

for example, if I "dragged" a credit card number to a remote page, this one should not read my data if I did not "reset"

firefox does the same, but allows getData () to be read if the "domain" of events is the same

+7
source

There is a chrome bug that only allows certain mime types to be used. Try changing the 'Text' in your code to 'text/plain' , which should work in chrome.

+2
source

All Articles