x
1
2
<html>3
<head>4
<meta charset="utf-8">5
<title>蜜蜂教程(mifengjc.com)</title>6
<style>7
.droptarget {8
float: left;9
width: 100px;10
height: 35px;11
margin: 15px;12
padding: 10px;13
border: 1px solid #aaaaaa;14
}15
</style>16
</head>17
<body>18
19
<p>该实例演示了如何向 p 元素添加 "ondragstart" 和 "ondrag" 事件及向 div 元素添加 "ondragover" 和 "ondrop" 事件。 </p>20
<p>在两个矩形框中来回拖动 p 元素:</p>21
<div class="droptarget" ondrop="drop(event)" ondragover="allowDrop(event)">22
<p ondragstart="dragStart(event)" ondragend="dragEnd(event)" draggable="true" id="dragtarget">拖动我!</p>23
</div>24
<div class="droptarget" ondrop="drop(event)" ondragover="allowDrop(event)"></div>