Question

我编写了以下代码来计算鼠标移动坐标

$(document).mousemove(function(e){
  console.log(e.pageX + ", " + e.pageY);
});

和here是小提琴。

我的问题是，当我慢慢移动鼠标时，我能够在控制台中看到所有鼠标移动的坐标。但是当我走得更快时，我看不到所有。只有少数人被计算在内。我的代码有问题吗？

Answer 1

没有。这是操作系统的设计行为。这不是浏览器的错;浏览器只为您提供从操作系统获得的内容。

Answer 2

你需要内插它们（即计算你们之间的点数）。浏览器将在每个新的滴答时返回鼠标位置（例如每0.01秒）。

令人高兴的是，鼠标位置只会经常检查，否则操作系统会立即冻结。

内插可能看起来像

var posX, posY;
$(document).mousemove(function(e){
  var points = [];
  if(posX && posY) {
      // calculate a straight line that the mouse moved over
      // It gets more difficult if you want to take e.g. 
      // the current curved path into account
      var diffX = e.pageX - posX;
      var diffY = e.pageY - poxY;
      var length = Math.round(Math.sqrt((diffY*diffY)+(diffX*diffX)));
      for(n=0;n<length;n++) {
          var pointX = posX + (n/length) * diffX;
          var pointY = posY + (n/length) * diffY;
          points.push({x:pointX,y:pointY});
      }
  }
  points.push({x:e.pageX,y:e.pageY});
  posX = e.pageX;
  poxY = e.pageY;
  for(point in points) {
      console.log(point.x + ", " + point.y);
  }
});

在更快地移动鼠标时无法捕获所有鼠标坐标

2 个答案: