将元素转换为可放置区域的要求是什么

Question

我想知道HTML5中拖放API中的有效可放置区域是什么。 我读过几篇文章，每篇文章的要求都不同：

• 应至少有三个事件处理程序：dragenter，dragover和drop
• 应具有draggable=true属性
• 应与dataTransfer.setData("text/plain", data)
设置的mime类型匹配
• 应具有dropzone属性

需要以下哪些？还有其他要求吗？

Answer 1

请参阅：http://www.w3schools.com/html/html5_draganddrop.asp

首先：要使元素可拖动，请将 draggable 属性设置为true：

<img draggable="true">

dataTransfer.setData（）方法设置数据类型和拖动数据的值：

然后，指定拖动元素时应该发生的事情。

在上面的示例中， ondragstart 属性调用一个函数drag（event），用于指定要拖动的数据。

dataTransfer.setData（）方法设置数据类型和拖动数据的值：

function drag(ev) {
    ev.dataTransfer.setData("text", ev.target.id);
}

在这种情况下，数据类型为“text”，值为可拖动元素的id（“drag1”）。

ondragover 事件指定可以删除拖动数据的位置。

默认情况下，不能在其他元素中删除数据/元素。为了允许删除，我们必须阻止元素的默认处理。

这是通过为ondragover事件调用 event.preventDefault（）方法来完成的：

event.preventDefault()

删除拖动的数据时，会发生丢弃事件。

在上面的例子中，ondrop属性调用一个函数drop（event）：

    function drag(ev) {
        ev.dataTransfer.setData("text", ev.target.id);
    }