Question

<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/（此处自定义类型而不是文字）

在firefox中打印：

222 attr
222 dt

in chrome prints：

222 attr
 dt

这里的问题在哪里？提前谢谢

Answer 1

回答自己：

显然chrome只允许在drop事件中读取dataTransfer的数据

这是出于安全原因

例如，如果我“拖过”远程页面上的信用卡号码，除非我没有“丢弃”，否则这个号码应该无法读取我的数据

firefox也是如此，但如果事件的“域”相同则允许读取getData（）

Answer 2

有bug in chrome只允许您使用某些mime类型。尝试将代码中的'Text'更改为'text/plain'，这应该适用于chrome。

drag＆amp; drop的dataTransfer.setData在chrome中不起作用？

2 个答案: