<script>var Box = document.querySelector('#box')on(Box,'mousedown',function(e){
e = e || window.event// 获取事件对象 var BoxX = e.offsetX// 获取鼠标点击时到div的顶部和左边的距离 var BoxY = e.offsetY
functionmove(e){
e = e || window.event
var left = e.clientX - BoxX
var top = e.clientY - BoxY
Box.style.left = left +'px'
Box.style.top = top +'px'//限制左上角边缘距离 if(left<=0){
left=0;}
Box.style.left = left +"px"if(top<=0){
top=0}
Box.style.top = top +"px"//限制右下角边缘距离 var maxL = window.innerWidth - Box.offsetWidth;var maxT = window.innerHeight - Box.offsetHeight;if(left>=maxL){
left = maxL;}
Box.style.left = left +"px"if(top>=maxT){
top = maxT;}
Box.style.top = top +"px"}on(document,'mousemove',move)// up抬起时,解除监听 on(document,'mouseup',function(){off(document,'mousemove',move)})// 避免全选文字造成的bug,在这里阻止默认行为 if(e.preventDefault){
e.preventDefault()}else{returnfalse}})</script>