我想要把拖拽的图片放到div中，然后图片消失，但是不知道怎么弄。
然后就是拖放功能在使用浏览器的开发者工具查看是就失效了。
html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>title>
<style type="text/css">
#div1{
width: 6.25rem;
height: 6.25rem;
border: 3px solid red;
position: absolute;
left: 25rem;
top: 18.75rem;
}
img{
width: 6.25rem;
height: 6.25rem;
}
style>
head>
<body>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
div>
<img src="quote.png" id="myimg" draggable="true" ondragstart="dg(event);"/>
body>
<script type="text/javascript">
function dg(e){
//将拖动的元素的id传递到后面的事件函数
e.dataTransfer.setData("eid",e.target.id);
}
function allowDrop(e){
//获取被拖动的元素的id
//var id=e.dataTransfer.getData("eid")
//阻止默认行为
e.preventDefault();
}
function drop(e){
//阻止默认行为
e.preventDefault();
//获取被拖动的元素的id
var data=e.dataTransfer.getData("eid");
//进行dom操作
//e.target指的是div
//appendChild添加元素
e.target.appendChild(document.getElementById(data));
}
script>
html>
<script type="text/javascript">
var vimg;
function dg(e) {
//将拖动的元素的id传递到后面的事件函数
vimg = e.target.id;
e.dataTransfer.setData("eid", e.target.id);
}
function allowDrop(e) {
//获取被拖动的元素的id
//var id = e.dataTransfer.getData("eid");
//阻止默认行为
e.preventDefault();
}
function drop(e) {
var t = document.getElementById(vimg);
t.parentNode.removeChild(t);
//阻止默认行为
e.preventDefault();
//获取被拖动的元素的id
//var data = e.dataTransfer.getData("eid");
//进行dom操作
//e.target指的是div
//appendChild添加元素
//e.target.appendChild(document.getElementById(data));
}
</script>