<!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>Untitled Document</title>
<style type="text/css">
#divId { width:100px; height:100px; position:absolute; left:0; top:0; background:#f00; }
</style>
</head><body>
<div id="divId"></div>
<div id="divId1" style="width:50px; height:50px; background:#0f0; margin:500px;"></div>
<script type="text/javascript">
var x,y;
document.getElementById("divId").onmousedown = function() {
document.onmousemove = function(e) {
var e = e || window.event;
e.preventDefault();
x = e.clientX;
y = e.clientY;
document.getElementById("divId").style.left = x + "px";
document.getElementById("divId").style.top = y + "px";
}
};document.onmouseup = function(e) {
var e = e || window.event;
e.preventDefault();
document.onmousemove = null;
};</script>
</body>
</html>
拖动代码如上,为什么托完还要再点击一下才可以啊

解决方案 »

  1.   

    在火狐中onmouseup没有被触发,所以不会停止。
    这个问题好像只有在火狐中有,不知道怎么解决,关注一下。document.getElementById("divId").onmouseup = function(e){alert("up");
    document.onmouseup = function(e){
    var e = e || window.event;
    e.preventDefault();
    document.onmousemove = null;
    };
    };这样改一下,我这边在前几次拖动的时候是可以的,但是之后又出问题了,不明白
      

  2.   

    改成这个试试 document.body.onmouseup
      

  3.   

    http://bbs.csdn.net/topics/390294260这个帖子有方法的才看到,楼主看看吧。。