实例代码“Ctrl+/”提示“F11/ESC”全屏 返回 格式化 恢复 运行
x
 
1
<!DOCTYPE HTML>
2
<html>
3
<head>
4
<style type="text/css">
5
#div1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;}
6
</style>
7
<script>
8
function allowDrop(ev)
9
{
10
ev.preventDefault();
11
}
12
13
function drag(ev)
14
{
15
ev.dataTransfer.setData("Text",ev.target.id);
16
}
17
18
function drop(ev)
19
{
20
ev.preventDefault();
21
var data=ev.dataTransfer.getData("Text");
22
ev.target.appendChild(document.getElementById(data));
23
}
24
</script>
25
</head>
26
<body>
27
28
<p>拖动 shouce.ren 图片到矩形框中:</p>
29
30
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
31
<br>
32
<img id="drag1" src="/upload/images/201509/cfcc6c13c28.gif" draggable="true" ondragstart="drag(event)" width="336" height="69">
33
34
</body>
35
</html>
36
37