h5拖放

拖放时h5的标准组成部分，拖放开始执行ondragstart调用一个函数，drag(event),它规定了被拖动的数据；设置拖动数据的数据类型和值使用setData()。ondragover事件规定在何处放置被拖放的数据；ondrop方法实现拖动数据放在哪个位置上。

实现拖放（代码有误，但是没有找出来在哪）

<div id="box1" style="width: 400px; height: 400px; background-color: #ccc;"></div><img src="oneself.jpg" id="img1"/><div id="msg"></div>

下面是js文件

var box1div;var msgdiv;var img1;window.onload = function(){box1div = document.getElementById("box1");msgdiv = document.getElementBuId("msg");img1 = document.getElementById("img1");//box1div.ondragenter = function(e){//showObj(e);//}box1div.ondragover = function(){e.preventDefault();}img1.ondragstart = function(){e.DataTransfer.setData("imgId","img1");}box1div.ondrop = dropImg;}//封装方法function dropImg(e){showObj(e.DataTransfer);e.preventDefault();//创建节点var img = document.getElementById(e.DataTransfer.getData("imgId"));//box1div.appendChild(img);//一个区域拖动e.target.appendChild(img);}function showObj(obj){var s = "";for (var k in obj) {s+=k+":"+obj[k]+"<br/>"}msgdiv.innerHTML = s;}