x使用說明？
<title>Document</title>
<style>
#item{
width:100px;
height: 100px;
background:red;
}
#wrapper{
height: 300px;
width: 300px;
border: 2px solid #000;
margin-top: 20px;
}
</style>
</head>
<body>
<div id="item" draggable="true">被拖拽元素</div>
<div id="wrapper">目標元素</div>
<script>
var item = document.getElementById('item')
var wrapper = document.getElementById('wrapper');
/**
* 拖拽開始是觸發的事件；
*/
item.addEventListener('dragstart',function(){
console.log('dragstart');
})
/**
* 拖拽結束時觸發的事件
*/
item.addEventListener('dragend',function(){
console.log('dragend');
})
/**
* 被拖拽元素進入目標元素時觸發
*/
wrapper.addEventListener('dragenter',function(){
console.log('enter');
})
/**
* 被拖拽元素在目標元素上時觸發
*/
wrapper.addEventListener('dragover',function(e){
e.preventDefault();
console.log('over');
})
/**
* 鼠標在目標元素上松開時觸發
觸發條件：必須在阻止dragover的默認事件
*/
wrapper.addEventListener('drop',function(){
console.log('drop');
})