拖动对象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、在要拖动的对象上定义ondragstart="drag(event)"

3、在目标对象上定义ondragover="allowdrag(event)"和ondrop="drop(event)"

拖拽相关方法:

ondragstart 拖拽前触发

ondragend 拖拽结束触发 

ondragenter 相当于onmouseover

ondragleave 相当于onmouseout

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

ondrop 释放鼠标的时候触发

preventDefault() 阻止默认事件

 

posted @ 2017-01-04 19:18  彩泉  阅读(529)  评论(0编辑  收藏  举报