操作:选中一个 可拖拽的(draggable)元素,并将其拖拽(鼠标不放开)到一个 可放置的(droppable)元素,然后释放鼠标。

首先,为了使元素可拖动,把 draggable 属性设置为 true:如 <img draggable="true">

被拖动的目标上的事件:

  • ondragstart:拖放开始时触发
  • ondrag:正在拖放时触发
  • ondragend:拖放完成后触发

可放置目标上的事件:

  • ondragenter:进入放置目标时触发
  • ondragover:在放置目标容器内移动时触发(每 100 毫秒触发一次)
  • ondragleave:离开放置目标时触发
  • ondrop:在放置目标内放下时触发