<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/ (custom type here instead of text)
in firefox prints:
222 attr
222 dt
in chrome prints:
222 attr
dt
where is the problem here? thanks in advance
answering to myself:
apparently chrome allows to read dataTransfer's data only in the drop event
this is for security reason
for instance if I "drag over" a credit card number on a remote page, this one should not be able to read my data unless i have not "dropped"
firefox does the same, but allows to read getData() if "domain" of events is the same
There is a bug in chrome that allows you only to use certain mime-types. Try to change 'Text'
in your code to 'text/plain'
, that should work in chrome.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With