Javascript 如何检测用户'；老鼠动了？

我试图检测鼠标移动的距离，以像素为单位。我目前正在使用：

$(document).mousemove(function(event) {
    var startingTop = 10,
        startingLeft = 22,
        math = Math.abs(((startingTop - event.clientY) + (startingLeft - event.clientX)) + 14) + 'px';
    $('span').text('From your starting point(22x10) you moved:   ' + math);
});

然而，我觉得这不是正确的方法，或者是吗？对我来说，这感觉不太一致

下面是它目前工作原理的演示：

额外详情：

---

实际上，我正在开发一个拖放插件，我想创建一个名为

距离

的功能，就像DragTable一样，在拖动之前，你必须将鼠标拖动一定数量的像素。我不是100%确定如何做到这一点，所以首先我需要获得鼠标从开始顶部和开始左侧位置移动的像素

---

有人有什么建议吗？

这里有一个可以测量鼠标移动距离的版本：

var totalDistance=0；
var lastSeenAt={x:null，y:null}；
$（文档）.mousemove（函数（事件）{
如果（lastSeenAt.x）{
totalDistance+=Math.sqrt（Math.pow（lastSeenAt.y-event.clientY，2）+Math.pow（lastSeenAt.x-event.clientX，2））；
$（'span'）.text（'到目前为止，您的鼠标运行了这么多像素：'+Math.round（totalDistance））；
}
lastSeenAt.x=event.clientX；
lastSeenAt.y=event.clientY；
});
提出了一种类似于塞吉奥的方法，但这将计算出鼠标按下点的距离，就像jfriend所说的两点之间的距离

d=（（x1-x2）^2+（y1-y2）^2）^（1/2）

var totalMovement=0；
var lastX=-1；
变量lastY=-1；
var startX=-1；
var-startY=-1；
$（文档）.mousemove（函数（事件）{
如果（startX==-1）{
返回；
}
如果（开始==-1）{
返回；
}
totalMovement+=Math.sqrt（Math.pow（lastY-event.clientY，2）+Math.pow（lastX-event.clientX，2））；
$（'span'）.text（'从您移动的起点（'+startX+'x'+startY+'）开始：'+totalMovement）；
lastX=event.clientX；
lastY=event.clientY；
});
$（文档）.mousedown（函数（事件）{
startX=event.clientX；
startY=event.clientY；
lastX=event.clientX；
lastY=event.clientY；
});
$（文档）.mouseup（函数（事件）{
startX=-1；
startY=-1；
总运动=0；
lastX=0；
lastY=0；
});
你的数学算错了。以下是改进版：

你是否需要累积距离？不确定你真正想做什么，但两点之间的距离计算为：
Math.sqrt（（deltaX*deltaX）+（deltaY*deltaY））
你能把这作为一个答案，再加上一些细节吗。我不明白这是怎么回事。不，我不能把它放在一个答案中，因为我无法从你的问题中理解你想做什么。请澄清。我实际上正在开发一个拖放插件。我想创建一个名为距离的功能。就像draggable一样。在拖动鼠标之前，你必须拉动鼠标一定量的PX。我不太清楚怎么做。所以首先我需要得到鼠标从
startingTop
和
startingLeft
位置移动的PX。这不是我想要的。下面是我想要的更好的描述：我实际上正在开发一个拖放插件。我想创建一个叫做距离的特征。就像draggable一样。在拖动鼠标之前，你必须拉动鼠标一定量的PX。我不太清楚怎么做。因此，首先我需要得到鼠标从开始的顶部和开始的左侧位置移动的PX。这就引出了一个问题，为什么你要重新发明轮子，而不是修改jQuery UI的拖动能力来实现你的目标。这就是鼠标移动的量。我需要检测鼠标距离起始点有多少像素。检查我所做的编辑，它会记录鼠标现在被按住后的总移动量。@Motes:您应该将其放入JSFIDLE。在那里测试要容易得多：-）但是当使用不同的数字时它不起作用。比如这里：@Shawn31313:你说“它不工作”是什么意思？我觉得很管用，没关系。就在我把它放进插件的时候。我需要在数学上做些改变。再次感谢你的回答。
$(document).mousemove(function(event) {
    var startingTop = 10,
        startingLeft = 22,
        math = Math.round(Math.sqrt(Math.pow(startingTop - event.clientY, 2) + 
                                    Math.pow(startingLeft - event.clientX, 2))) + 'px';
    $('span').text('From your starting point(22x10) you moved:   ' + math);
});