事件名称 作用对象作用对象
Dragstar事件被拖动的drag对象。 当对象开始拖动时触发。
Drag事件 被拖动的drag对象。 在Drag对象被拖动期间连续触发。
Dragend事件 被拖动的drag对象。 在Drag对象拖动到Drop目标对象上时被触发。
Dragenter事件 drop对象 在Drag对象拖动到Drop目标对象边界时触发。
Dragover事件 drop对象 当Drag对象在Drop目标对象上移动时触发,且会反复的触发该事件。
Dragleave事件 drop对象 Dragleave事件在这个拖动对象离开Drop目标对象的范围时触发。
Drop事件 drop对象 当这个Drag对象在Drop对象上释放鼠标时触发
这些是HTML5的新特性,可以在秒秒学查找相关的资料。
一个完整的drag and drop流程通常包含以下几个步骤:1.设置可拖拽目标.设置属性draggable="true"使元素编程可拖拽对象.
2.监听dragstart设置拖拽数据
3.为拖拽 *** 作设置反馈图标(可选)
4.设置允许的拖放效果,如copy,move,link
5.设置拖放目标,默认情况下浏览器阻止所有的拖放 *** 作,所以需要监听dragenter或者dragover取消浏览器默认行为使元素可拖放.
6.监听drop事件执行所需 *** 作
这些是HTML5的新特性,如果你想了解更有相关的知识,你可以在一个叫做秒秒学的网站查找相关资料。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)