拖动对象ondrag

说明：

在进行拖放操作时，dataTransfer 对象用来保存被拖动的数据。它可以保存一项或多项数据、一种或者多种数据类型。dataTransfer对象有两个主要的方法：getData()方法和setData()方法。

setData("Text",ev.target.id)：用指定的数据格式把数据插入 DataObject 对象。

语法 object.SetData [data],[format]

getData()方法可以取得由setData()方法保存的值。setData()方法的第一个参数，也是getData()方法唯一的一个参数，是用来保存数据类型的字符串，取值是”text”或”URL”。

实现步骤：

1、对要拖动的对象定义draggable="ture"

2、在要拖动的对象上定义οndragstart="drag(event)"

3、在目标对象上定义οndragοver="allowdrag(event)"和οndrοp="drop(event)"

拖拽相关方法：

ondragstart 拖拽前触发

ondragend 拖拽结束触发 

ondragenter 相当于onmouseover

ondragleave 相当于onmouseout

ondragover 进入目标、离开目标之间，连续触发

ondrop 释放鼠标的时候触发

preventDefault() 阻止默认事件

 

转载于:https://www.cnblogs.com/caiquan/p/6249959.html