JS计算鼠标点击时移动的距离

JS calculating distance mouse travelled on clicks

本文关键字:移动 距离 计算 鼠标 JS      更新时间:2023-09-26

我正在尝试计算用户单击时记录的距离,并在用户再次单击后停止记录。我该怎么做?由于我不太熟悉鼠标事件,我尝试过使用单击事件,但每次单击时,我都会完全停止该功能。我有以下代码。

var xTravelled = 0, yTravelled = 0, prevX, prevY, count = 0, select = false;
$(document).on({
    click : function(e) {
        select = true;
    },
    mousemove : function(e) {
        if (select) {
            prevY && (yTravelled += Math.abs(e.pageY - prevY));
            prevX && (xTravelled += Math.abs(e.pageX - prevX));
            prevX = e.pageX;
            prevY = e.pageY;
            $('#result').text(yTravelled + xTravelled);
        }
    }
});

只需更改

 click : function(e) {
        select = (select==false)?true:false;
    },

这里是小提琴