关于html5图片拖动的代码的问题？

Question

这段代码有什么其他的写法或者修改的方法，跪求大神

• 

•  

• 

Answer 1

一、关于拖拽API拖拽API是HTML5的新特性，相对于其他新特性来说，重要程度占到6成，实际开发中使用比例占到3成，学习要求个人认为是达到掌握即可的程度。二、什么是拖拽和释放？拖拽：Drag释放：Drop拖拽指的是鼠标点击源对象后一直移动对象不松手，一但松手即释放了三、什么是源对象和目标对象？源对象：指的是我们鼠标点击的一个事物，这里可以是一张图片，一个DIV，一段文本等等。目标对象：指的是我们拖动源对象后移动到一块区域，源对象可以进入这个区域，可以在这个区域上方悬停(未松手)，可以释松手释放将源对象放置此处(已松手)，也可以悬停后离开该区域。四、拖拽API的相关函数解释了什么是源对象和目标对象后，回归前端中的拖拽API，由上面的操作我们可以得出几个函数被拖动的源对象可以触发的事件：(1)ondragstart：源对象开始被拖动(2)ondrag：源对象被拖动过程中(鼠标可能在移动也可能未移动)(3)ondragend：源对象被拖动结束拖动源对象可以进入到上方的目标对象可以触发的事件：(1)ondragenter：目标对象被源对象拖动着进入(2)ondragover：目标对象被源对象拖动着悬停在上方(3)ondragleave：源对象拖动着离开了目标对象(4)ondrop：源对象拖动着在目标对象上方释放/松手拖拽API总共就是7个函数！！五、如何在拖动的源对象事件和目标对象事件间传递数据HTML5为所有的拖动相关事件提供了一个新的属性：e.dataTransfer { } //数据传递对象功能：用于在源对象和目标对象的事件间传递数据源对象上的事件处理中保存数据：e.dataTransfer.setData( k, v ); //k-v必须都是string类型目标对象上的事件处理中读取数据：var v = e.dataTransfer.getData( k );