javascript实现拖拽事件（兼容IE8）
Posted jujuno
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript实现拖拽事件（兼容IE8）相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<sytle type="text/css">
</sytle>
<script>
function drag(obj)
var obj=document.getElementById(obj);
obj.onmousedown=function (event) //点下鼠标
obj.setPointerCapture&&obj.releasePointerCapture();//兼容ie8，强行捕获页面点击事件到obj
event=event||window.event;//event兼容性问题
var ol=event.clientX-obj.offsetLeft;
var ot=event.clientY-obj.offsetTop;
document.onmousemove=function (event) //鼠标移动
event=event||window.event;
var left=event.clientX-ol;
var top=event.clientY-ot;
obj.style.left=left+"px";
obj.style.top=top+"px";
;
document.onmouseup=function () //释放鼠标
document.onmousemove=null;//取消鼠标移动事件
document.onmouseup=null;//取消释放鼠标事件以避免点击obj以外的东西时仍然触发onmouseup
obj.releasePointerCapture&&obj.releasePointerCapture();//取消捕获
;
return false;//消除浏览器对拖拽的默认行为
;
window.onload=function ()
drag("box1");//调用对象
drag("box2");
</script>
</head>
<body>
dal
<div id="box1" style="width: 100px;height: 100px;background-color:cadetblue;position: absolute"></div>
<div id="box2" style="width: 100px;height: 100px;background-color:palevioletred;position: absolute;left: 200px;top: 200px"></div>
</body>
</html>以上是关于javascript实现拖拽事件（兼容IE8）的主要内容，如果未能解决你的问题，请参考以下文章