javascript - 使用 dataTransfer.setData 通过拖放传输 JSON

标签 javascript html drag-and-drop

我正在尝试使用 HTML5 拖放功能传输 JSON 数据(而不是字符串)

开始拖动时,您可以设置数据:

e.originalEvent.dataTransfer.setData("application/json", {x: 10});
},

当可拖动对象被放下时

e.originalEvent.dataTransfer.getData("application/json");

但无论我做什么,它总是一个字符串。如何传输实际对象? DEMO

最佳答案

JSON 是数据的字符串表示形式(例如序列化对象的数据)。这就是为什么您会得到字符串结果。

如果您的序列化对象包含具有唯一标识符(id)的属性,您可以从 json 结构中读取 id 并引用您的源对象(例如通过 id 获取源对象)。

要通过 ID 获取 HTML5 元素,您可以使用 JavaScript getElementById 功能。 请参阅https://www.w3schools.com/jsref/met_document_getelementbyid.asp

关于javascript - 使用 dataTransfer.setData 通过拖放传输 JSON,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47893843/

相关文章:

c# - 将拖放限制在单个控件内

javascript - webpack 和两个不同的来源网站

javascript - 谷歌图表 : filter GeoChart

javascript - React-Redux——从列表中选择项目

html - 需要帮助创建一个充满图像的响应式页脚

html - 如何在不改变背景内容的情况下改变背景的不透明度?

jquery - anchor 标记在移动浏览器中不起作用

jquery-ui - Jquery droppable获取多个draggable id

javascript - 类似 iPhoneX 通过拖动显示/隐藏菜单/容器

Javascript:循环结构对象?什么情况下使用这个?