默认行为只允许将文本拖入页面的可编辑区域中。可以通过在元素的开始标签中包含
contenteditable
属性,指定可以使元素及其子级可编辑。还可以通过将文档对象的
designMode
属性设置为
"on"
,使整个文档可编辑。
可以通过处理可接受所拖动数据的任何元素的
dragenter
、
dragover
和
drop
事件,支持页面上的替代拖入行为。
允许拖入
若要处理拖入手势,必须先取消默认行为。侦听您要用作放置目标的任何 HTML 元素上发生的
dragenter
和
dragover
事件。在这些事件的处理函数中,调用调度的事件对象的
preventDefault()
方法。如果取消默认行为,则会允许不可编辑的区域接收放置。
获取放置的数据
可以在
ondrop
事件的处理函数中访问放置的数据:
function doDrop(event){
droppedText = event.dataTransfer.getData("text/plain");
}
使用
dataTransfer.getData()
方法将数据读到剪贴板上,同时传入要读取的数据格式的 MIME 类型。可以使用
dataTransfer
对象的
types
属性查明哪些数据格式可用。
types
数组包含每种可用格式的 MIME 类型字符串。
取消 dragenter 或 dragover 事件中的默认行为后,须由您将放置的任何数据插入到其在文档中的正确位置。不存在可将鼠标位置转换成元素内的插入点的 API。由于存在这一限制,因而可能很难实现插入类型的拖动手势。
|
|
|