
请帮我看看下面的js代码有哪些错误,为什么mouseup后不能释放元素?
/*以下是测试的html代码*/<!doctypehtml><htmllang="en"><head><scripttype="text/javascript"src="...
/*以下是测试的html代码*/
<!doctype html>
<html lang="en">
<head>
<script type="text/javascript" src="./JS/41_17_5_drag.js"></script>
<title>Document</title>
</head>
<body>
<div style="position:absolute; left:100px;top:100px;width:200px;height:200px;background-color:red;" onmousedown="drag(this,event)" ></div>
</body>
</html>
/************************************************************************************************************************************/
/*以下是js代码
*41_17_5_drag.js
*/
//元素必须是绝对定位
function getScrollOffsets(w){
w=w|| window;
if(w.pageXOffset!=null)
return {x:w.pageXOffset,y:w.pageYOffset};
}
function drag(elementToDrag,event){
var scroll=getScrollOffsets();
var startX=event.clientX+scroll.x;
var startY=event.clientY+scroll.y;
var origX=elementToDrag.offsetLeft;
var origY=elementToDrag.offsetTop;
var deltaX=startX-origX;
var deltaY=startY-origY;
elementToDrag.addEventListener("mousemove",moveHandler,true);
elementToDrag.addEventListener("mouseup",upHandler,true);
event.stopPropagation();
if(event.preventDefault) event.preventDefault();
else event.returnValue=false;
function moveHandler(e){
if(!e) e=window.event;
var scroll=getScrollOffsets();
elementToDrag.style.left=(e.clientX+scroll.x-deltaX)+"px";
elementToDrag.style.top=(e.clientY+scroll.y-deltaY)+"px";
e.stopPropagation();
}
function upHandler(e){
if(!e) e=window.event;
if(elementToDrag.removeEventListener){
elementToDrag.removeEventListener("mouseover",moveHandler,true);
elementToDrag.removeEventListener("mouseup",upHandler,true);
elementToDrag.releaseCapture();
}else if(document.detachEvent){
elementToDrag.detachEvent("onlosecapture",upHandler);
elementToDrag.detachEvent("onmouseup",upHandler);
elementToDrag.detachEvent("onmousemove",moveHandler);
elementToDrag.releaseCapture();
}
e.stopPropagation();
}
} 展开
<!doctype html>
<html lang="en">
<head>
<script type="text/javascript" src="./JS/41_17_5_drag.js"></script>
<title>Document</title>
</head>
<body>
<div style="position:absolute; left:100px;top:100px;width:200px;height:200px;background-color:red;" onmousedown="drag(this,event)" ></div>
</body>
</html>
/************************************************************************************************************************************/
/*以下是js代码
*41_17_5_drag.js
*/
//元素必须是绝对定位
function getScrollOffsets(w){
w=w|| window;
if(w.pageXOffset!=null)
return {x:w.pageXOffset,y:w.pageYOffset};
}
function drag(elementToDrag,event){
var scroll=getScrollOffsets();
var startX=event.clientX+scroll.x;
var startY=event.clientY+scroll.y;
var origX=elementToDrag.offsetLeft;
var origY=elementToDrag.offsetTop;
var deltaX=startX-origX;
var deltaY=startY-origY;
elementToDrag.addEventListener("mousemove",moveHandler,true);
elementToDrag.addEventListener("mouseup",upHandler,true);
event.stopPropagation();
if(event.preventDefault) event.preventDefault();
else event.returnValue=false;
function moveHandler(e){
if(!e) e=window.event;
var scroll=getScrollOffsets();
elementToDrag.style.left=(e.clientX+scroll.x-deltaX)+"px";
elementToDrag.style.top=(e.clientY+scroll.y-deltaY)+"px";
e.stopPropagation();
}
function upHandler(e){
if(!e) e=window.event;
if(elementToDrag.removeEventListener){
elementToDrag.removeEventListener("mouseover",moveHandler,true);
elementToDrag.removeEventListener("mouseup",upHandler,true);
elementToDrag.releaseCapture();
}else if(document.detachEvent){
elementToDrag.detachEvent("onlosecapture",upHandler);
elementToDrag.detachEvent("onmouseup",upHandler);
elementToDrag.detachEvent("onmousemove",moveHandler);
elementToDrag.releaseCapture();
}
e.stopPropagation();
}
} 展开
2个回答
展开全部
upHandler() 你把这个方法放到外面去吧, 这样是不能被调用的,还有moveHandler()
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询