JavaScript高级程序设计59.pdf

dropEffect和effectAllowed

利用dataTransfer对象，传输数据、确定被拖动元素以及作为放置目标的元素能够接受什么操作，为此需要访问对象的两个属性dropEffect和effectAllowed

其中通过dropEffect属性可以知道被拖动元素能够执行哪种放置行为，有4个可能的值

“none”：不能把拖动的元素放到这里，这是除文本框以外所有元素的默认值

“move”：应该把拖动的元素移动到放置目标

“copy”：应该把拖动的元素复制到放置目标

“link”：表示放置目标会打开拖动的元素（但拖动元素必须是一个链接，有URL）

要使用dropEffect属性，必须在ondragenter事件处理程序中针对放置目标来设置它

dropEffect属性只有搭配effectAllowed属性才有用，effectAllowed属性表示允许拖动元素的哪种dropEffect，可能的值如下

“uninitialized”：未给被拖动的元素设置任何放置行为

“none”：被拖动的元素不能有任何行为

“copy”：只允许值为“copy”的dropEffect

“link”：只允许值为“link”的dropEffect

“move”：只允许值为“move”的dropEffect

“copyLink”：允许值为“copy”和“link”的dropEffect

“copyMove”：允许值为“copy”和“move”的dropEffect

“linkMove”：允许值为“link”和“move”的dropEffect

“all”：允许任意的dropEffect

必须在ondragstart事件处理程序中设置effectAllowed属性

可拖动

默认情况下，图像、链接和文本是可拖动的，不需编写额外的代码，让其它元素可拖动也是有可能的。

HTML5为所有HTML元素规定了一个draggable属性，表示元素是否可以拖动，图像、链接的draggable属性自动设置为true，其他元素默认值都是false

<!--让这个元素可以拖动-->

<div draggable="true">...</div>

其他成员

HTML5规范规定dataTransfer对象还应该包含下列的方法和属性

addElement(element)：为拖动操作添加一个元素。添加这个元素只影响数据，不会影响页面元素的外观

clearData(format)：清除以特定格式保存的数据

setdragImage(element,x,y)：指定一幅图片，当拖动发生时，显示在光标下方

types：当前保存的数据类型