如何检索mousedown到mouseup事件之间的所有鼠标坐标

3 回答

• 1

  如果您需要捕获鼠标在拖动过程中移动的所有点，请绑定/取消绑定新的 mousemove 处理程序：

  var allPoints = [];
  $("#dic").mouseup(function (e) {
      $(this).unbind("mousemove", trackPoints);
  }).mousedown(function (e) {
      $(this).bind("mousemove", trackPoints); 
  });
  
  function trackPoints(e) {
      allPoints.push({ x: e.pageX, y: e.pageY });
  }
  

  这样， trackPoints 将在鼠标停止时开始触发，并在它返回时停止 .

  您可能还想将 if(e.which == 1) 添加到 mouseup 和 mousedown 处理程序的顶部，以便它们仅对鼠标左键执行 bind ，而不是中间或右侧按钮 .

  回复于 2024-04-25T11:35:00+08:00
• 4

  var X = [],
      Y = [],
      i = -1;
  $("#dic").mouseup(function(e) {
      ++i;
      X[i] = e.pageX;
      Y[i] = e.pageY;
      // reset everything on mouseup
      X = [];
      Y = [];
      i = -1;
  }).mousedown(function(e) {
      ++i;
      X[i] = e.pageX;
      Y[i] = e.pageY;
      console.log(X);
  }).mousemove(function(e) {
      ++i;
      X[i] = e.pageX;
      Y[i] = e.pageY;
  });
  

  DEMO

  回复于 2024-04-25T11:35:00+08:00
• 7

  var x = [], y = [], i = 0;
  
  $("#dic").mouseup(function (e) {
      $('#status').html(e.pageX +', '+ e.pageY + ' up');
      x[i] = e.pageX;
      y[i++] = e.pageY;
  
      console.log(x);
      console.log(y);
  });
  
  $("#dic").mousedown(function (e) {
      $('#status').html(e.pageX +', '+ e.pageY + ' down');
      i = 0;
      x[i] = e.pageX;
      y[i++] = e.pageY;
  });
  
  $("#dic").mousemove(function (e) {
      $('#status').html(e.pageX +', '+ e.pageY + ' move');
      x[i] = e.pageX;
      y[i++] = e.pageY;
  });
  

  这将开始在mousedown上记录鼠标位置，您可以在mouseup上看到控制台上的输出 . 然后，您可以使用数组的第一项和最后一项描述的codeparadox或开始和结束之间的任何其他点来计算距离 .

  Code on JSFiddle

  回复于 2024-04-25T11:35:00+08:00