日期:2014-05-16  浏览次数:20315 次

这个拖动后刷新页面不能保存拖动后的位置,求大神们给加上一个能保存位置的Cookie

<!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>  
<style type="text/css">  
#main div{position:absolute;width:40px;height:20px;border:1px solid #999;}  
</style>  
<script type="text/javascript">  
var a;  
document.onmouseup=function(){if(!a)return;document.all?a.releaseCapture():window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);a="";};  
document.onmousemove=function (d){if(!a)return;if(!d)d=event;a.style.left=(d.clientX-b)+"px";a.style.top=(d.clientY-c)+"px";

//输出内容 ;         
document.getElementById("output").value= a.id + " 左边:" + a.style.left +" 顶部:" + a.style.top 
};  
function $(o,e){a=o;document.all?a.setCapture():window.captureEvents(Event.MOUSEMOVE);b=e.clientX-parseInt(a.style.left);c=e.clientY-parseInt(a.style.top);}  
</script>  
</head>  
<body>  
  <div id="main">
    <div id="div1" style="left:100px;top:100px;background:#fc9;" onmousedown="$(this,event)">节点1</div>  
    <div id="div2" style="left:150px;top:100px;background:#9cf;" onmousedown="$(this,event)">节点2</div>  
    <div id="div3" style="left:200px;top:100px;background:#f9c;" onmousedown="$(this,event)">节点3</div>  
    <div id="div4" style="left:250px;top:100px;background:#9fc;" onmousedown="$(this,event)">节点4</div>  
    <div id="div5" style="left:300px;top:100px;background:#c9f;" onmousedown="$(this,event)">节点5</div>  
    <div id="div6" style="left:350px;top:100px;background:#cf9;" onmousedown="$(this,event)">节点6</div>
    <div id="div7" style="left:400px;top:100px;background:#cf9;" onmousedown="$(this,event)">节点7</div>
    <div id="div8" style="left:450px;top:100px;background:#cf9;" onmousedown="$(this,event)">节点8</div>
    <div id="div9" style="left:500px;top:100px;background:#cf9;" onmousedown="$(this,event)">节点9</div>
    <div id="div10" style="left:550px;top:100px;background:#cf9;" onmousedown="$(this,event)">节点10</div>
    <div id="div11" style="left:600px;top:100px;background:#cf9;" onmousedown="$(this,event)">节点11</div>
    <div id="div12" style="left:100px;top:200px;background:#cf9;" onmousedown="$(this,event)">节点12</div>
    <div id="div13" style="left:150px;top:200px;background:#cf9;" onmousedown="$(this,event)">节点13</div>
    <div id="div14" style="left:200px;top:200px;background:#cf9;" onmousedown="$(this,event)">节点14</div>
    <div id="div15" style="left:250px;top:200px;background:#cf9;" onmousedown="$(this,event)">节点15</div>
    <div id="div16" style="left:300p