dataTransfer.set拖放的数据在chrome中不起作用

dataTransfer.setData of drag&drop doesn't work in chrome?

本文关键字：chrome 不起作用 数据 set 拖放 dataTransfer      更新时间：2023-09-26
<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>

小提琴：

http://jsfiddle.net/vwjCa/

http://jsfiddle.net/vwjCa/2/（此处为自定义类型而不是文本）

在火狐打印中：

222 attr
222 dt

在镀铬打印中：

222 attr
 dt

问题出在哪里？提前致谢

回答自己：

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

这是出于安全原因

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

Firefox 也这样做，但如果事件的"域"相同，则允许读取 getData（）

chrome 中有一个错误，它只允许您使用某些 MIME 类型。尝试将代码中的'Text'更改为 'text/plain' ，这应该在 chrome 中工作。

相关文章：