2-3练习代码中，当鼠标拖动过快...
2-3练习代码中，当鼠标拖动过快，出了$('mian')正方形，然后放开鼠标。鼠标再移回正方形内时，不用点击，$('mian')也会跟着鼠标移动，请问,这是什么原因？
下面是我的代码：
<body>
<div id="dialog" class="dialog">
<div class="content"></div>
</div>
<script>
var isMouseDown=false;
var lastPoint={};
var width=$(window).width();
var height=$(window).height();
var w_dialog=$("#dialog").width();
var h_dialog=$("#dialog").height();
$("#dialog").on("mousedown",function(e){
isMouseDown=true;
lastPoint.x=e.pageX;
lastPoint.y=e.pageY;
}).on("mousemove",function(e){
if(isMouseDown){
var dialog=$("#dialog");
var targetX=parseInt(dialog.css("left"))+(e.pageX-lastPoint.x);
var targetY=parseInt(dialog.css("top"))+(e.pageY-lastPoint.y);
var w=targetX+w_dialog;
var h=targetY+h_dialog;
//当鼠标出了$("#dialog")区域
if(e.pageX<targetX || e.pageY<targetY || e.pageX>(targetX+w_dialog) ||e.pageY>(targetY+h_dialog)){
isMouseDown=false;
lastPoint = {};
}else{
if(targetX<=0){
dialog.css("left",'0px');
}else if(w>=width){
dialog.css("left",(width-w_dialog)+'px');
}else{
dialog.css("left",targetX+'px');
}
if(targetY<=0){
dialog.css("top",'0px');
}else if(h>=height){
dialog.css("top",(height-h_dialog)+'px');
}else{
dialog.css("top",targetY+'px');
}
lastPoint.x=e.pageX;
lastPoint.y=e.pageY;
}
}
}).on("mouseup",function(){
isMouseDown=false;
lastPoint = {};
})
</script>
</body>
正在回答
当拖动太快，鼠标超出区域块内，然后释放停止，这样是在document上面释放的，并不是在你绑定的dialog元素上面，所以鼠标移入进入，区域块还是会移动。可以给document绑定事件，参考：
自己测试下，祝学习愉快~~
- 参与学习 人
- 提交作业 467 份
- 解答问题 4826 个
本路径带你通过系统学习HTML5、JavaScript、jQuery的进阶知识，不仅如此，还会学习如何利用组件化的思想来开发网页，知识点+案例，使得所学可以更好的得到实践。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星