拖放

xiaoxiao2021-02-28  99

1.被拖元素设置为可拖放

draggable="true"

<div class="drag" id="drag1" draggable="true" οndragstart="drag(event)">俺是drag</div>

2.规定当被拖元素被拖动时会发生的事情

οndragstart="drag(event)"

把目标元素的id存放到text里面

function drag(event){     event.dataTransfer.setData("Text",event.target.id); }

3.设置另一个元素可接受被拖动数据

event.preventDefault();

消除默认属性(不允许接收另一个元素)

4.当松开鼠标会发生的事件

function drop(event){     event.preventDefault();//消除默认(元素不可以接受另一个元素)属性     var data = event.dataTransfer.getData("Text");     event.target.appendChild(document.getElementById(data)); }

转载请注明原文地址: https://www.6miu.com/read-51438.html

最新回复(0)