鼠标事件-拖拽
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style> #w{width:20px;height:20px;position:absolute;background:blue;} </style> <script> window.onload=function(){ var oDiv=document.getElementById("w"); oDiv.onmousedown=function(ev){ document.onmousemove=function(ev){ var e=ev || event; oDiv.style.left=e.clientX+"px"; oDiv.style.top=e.clientY+"px"; }; }; document.onmouseup=function(ev){//此处onmouseup触发事件需document触发,如换成div会造成无法接触onmousemove事件; document.onmousemove=null; }; }; </script> </head> <body> <div id="w"> </div> </body> </html>