如何在 html 拖放中设置自定义数据

Question

我正在尝试设置一个自定义数据，它是我的拖动事件上的 HTML 元素。到目前为止我这样做了：

element.addEventListener('dragstart', event => {
  event.dataTransfer.setData('custom-data', document.querySelector('.the-element')
})

dropzone.addEventListener('drop', event => {
  const data = event.dataTransfer.getData('custom-data') // this is empty
})

有没有办法做到这一点？

JSON.stringify在将元素传递给拖动事件之前，我已经尝试对其进行操作。但JSON.stringify不适用于 HTMLElement 对象

来自 mdn 的参考文献说可以使用自定义数据

Answer 1

根据此MDN 参考，您可以指定数据类型text/html并传递格式良好的 HTML 字符串。如果您想使用 DOM 中的现有元素，您可以传递其externalHTML字符串属性。