<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <div id="test" style="border:1px solid; width:400px; background:#CCCCCC;" > <p>我是拖拽示例DIV。</p> <p>可以试验一下效果。</p> </div> </body> <mce:script type="text/javascript"><!-- var dragging = false; var test; var mouseY; var mouseX; window.onload = function(){ test = document.getElementById("test"); test.οnmοusedοwn=down; test.οnmοusemοve=move; test.οnmοuseup=up; test.style.position = "relative"; test.style.top = "0px"; test.style.left = "0px"; } function down(event) { event=event||window.event; dragging = true; mouseX = parseInt(event.clientX); mouseY = parseInt(event.clientY); objY = parseInt(test.style.top); objX = parseInt(test.style.left); } function move(event){ event=event||window.event if(dragging == true){ var x,y; y = event.clientY - mouseY + objY; x = event.clientX - mouseX + objX; test.style.top = y + "px"; test.style.left = x + "px"; } } function up(){ dragging = false; } // --></mce:script> </html> 我们首先要声明一个 event 对象，无论移动、点击、按键等，都会激活一个 evnet ，在 Internet Explorer 里， event 是全局变量，会被存储在 window.event 里． 在 firefox 或者其他浏览器，event 会被相应的函数获取．当我们将mouseMove函数赋值于document.onmousemove，mouseMove 会获取鼠标移动事件。
为了让 event 在所有浏览器下获取了 event 事件，故写成event=event||windos.event;
