拖动 js 实现

	var canMove=false;
	var offsetX,offsetY;
	pop.onmousedown=function(e){
		canMove=true;
		offsetX=e.offsetX;
		//console.log(offsetX);
		offsetY=e.offsetY;
		//console.log(offsetY)
	}
	window.onmousemove=function(e){
		if(canMove){
			var top=e.clientY-offsetY,
					left=e.clientX-offsetX;
			pop.style.left=left+"px";
			pop.style.top=top+"px";
		}
	}
	pop.onmouseup=function(){
		canMove=false;
	}

pop  是被拖动对象的dom 
将上述代码作为函数封装 执行  即可绑定事件 完成拖动功能

 

另外 附上几个 h5新特性 拖动api  例如拖动图片上传和删除

 //拖动进入 16:32--16:34
 t2.ondragenter = function(){
     console.log("拖动进入");
 }
 //拖动悬停
 t2.ondragover = function(e){
     e.preventDefault();
     console.log("拖动悬停");
 }
 //拖动离开
 t2.ondragleave = function(){
     console.log("拖动离开");
 }
 //拖动释放
 t2.ondrop = function(){
     console.log("拖动释放");
 }