处理Javascript事件的正确方法

我有一个正在创建的拖动UI，如果用户单击锚定标记，但拖动超过25 PX，我需要能够在HREF之后禁用锚定标记。我的阻力传感器正在工作，问题是我无法使用

。click（）

，因为鼠标向下已经触发了阻力，而

。mouseup（）

对于游戏来说似乎太晚了，因为事件仍在触发

如何使以下代码正确

$(document).mousemove(function (e) {
  distance = e.pageX - initialPosition;
  $('#panorama').css({ 'left': distance });
  if (Math.abs(distance - 0) > 25) {
    //Event in question below:
    $('a').mouseup(function (e) { e.preventDefault(); });
  }
  return false;
});

---

很难知道您的实际意图是什么，但是移动到锚的目的地是在click事件中发生的，而不是mouseup事件，因此您需要在那里处理cancel

您可能还希望在单击事件中进行距离计算，而不是等待注册处理程序直到超过阈值，但这是您的调用

您可以在此处查看处理您的情况的代码：

很多代码都是为了可视化事件触发器的坐标和顺序

为子孙后代：

HTML

---

嘿！我想我们很接近，但有些可疑的事情正在发生。请注意，在代码中仍然有效，但我省略了.click（）的所有事件处理。我注意到控制台中没有显示任何单击事件，并且在平均拖动鼠标40 px后，只要我在mousedown内，跟踪就会停止。我尝试使用中的代码，但它不起作用。我认为您看到的“起作用”是浏览器在mousedown+move上拖动对象的默认事件。如果在鼠标向下移动时执行e.preventDefault（），则当鼠标后退时，浏览器仍会移动到下一页，再次需要单击preventDefault（）。

<a href="404.html">Link.....................................</a>
X:<span id='mouseX'></span>
Y:<span id='mouseY'></span>

var initialPos = 0;

$('a').mousedown(function(e){
  updatePos(e);
  console.log('down');
  initialPos = e.pageX;
});
$('a').mousemove(function(e){
  console.log('move');
  updatePos(e);
});
$('a').click(function(e){
  console.log('click');
  updatePos(e);
  var distance = e.pageX - initialPos;
  if (Math.abs(distance) > 5) {
    console.log("Passed threshold, cancelling event");
    e.preventDefault();
    return false;
  }
});

function updatePos(e) {
  $('#mouseX').html(e.pageX);
  $('#mouseY').html(e.pageY);
}