Jquery 如何判断鼠标在.click（）期间是否移动？

根据的jQuery文档，事件仅在以下一系列事件之后触发：

• 当指针位于元素内部时，按下鼠标按钮
• 鼠标按钮在指针位于元素内部时释放

我面临的问题是，我在一个项目网格上使用“点击拖动”功能，我想为每个项目注册点击事件。这意味着每次我单击拖动时，鼠标都会按在某个项目上，然后在拖动完成后释放该项目。这将触发单击事件

---

如果鼠标未在按下鼠标和释放鼠标之间移动，是否有方法仅触发事件？虽然这看起来很琐碎，但作为一名jQuery初学者，我有点困惑。

跟踪mousedown和mouseup之间的鼠标位置，以查看鼠标指针是否移动。您可能应该添加一点误差，比如每个方向都添加几个像素，但下面是一个简化的示例：

var left  = 0,
    top   = 0;    

$(element).on({
    mousedown: function(e) {
        left  = e.pageX;
        top   = e.pageY;
    },
    mouseup: function(e) {
        if (left != e.pageX || top != e.pageY) {
            alert(' OMG, it moved ! ');
        }
    }
});

---

在mousedown和mouseup之间跟踪鼠标位置，以查看鼠标指针是否移动。您可能应该添加一点误差，比如每个方向都添加几个像素，但下面是一个简化的示例：

var left  = 0,
    top   = 0;    

$(element).on({
    mousedown: function(e) {
        left  = e.pageX;
        top   = e.pageY;
    },
    mouseup: function(e) {
        if (left != e.pageX || top != e.pageY) {
            alert(' OMG, it moved ! ');
        }
    }
});

---

<>你认为鼠标下沉和鼠标事件触发是可行的选择吗？如果鼠标下拉的坐标与鼠标的坐标相同，则在点击时光标没有改变位置。

< P>你认为鼠标下沉和鼠标事件触发是可行的选择吗？如果鼠标向下的坐标与鼠标上的坐标相同，则光标在单击过程中没有改变位置。

否，不存在此类事件，因为这几乎是完全无用的。鼠标在点击时轻微移动是很常见的，即使用户不想这样做，尤其是在普通鼠标中，点击按钮位于鼠标本身

---

在mousedown和mouseup事件中获取鼠标坐标，并根据鼠标移动的距离对mouseup事件进行操作。

不，没有这样的事件，因为这几乎是完全无用的。鼠标在点击时轻微移动是很常见的，即使用户不想这样做，尤其是在普通鼠标中，点击按钮位于鼠标本身

---

在mousedown和mouseup事件中获取鼠标坐标，并根据鼠标移动的距离对mouseup事件进行操作。

我稍微修改了@adeneo的代码，因此它解决了用户将光标移动“一点点”的问题，实际上应该解释为单击。我用了欧几里德距离。您可以删除

Math.sqrt

以获得更好的性能，但随后必须调整

radiusLimit

变量

var left = 0,
    top = 0,
    radiusLimit = 5;

$(element).on({
  mousedown: function(event) {
    left = event.pageX;
    top = event.pageY;
  },
  mouseup: function(event) {
    var deltaX = event.pageX - left;
    var deltaY = event.pageY - top;
    var euclidean = Math.sqrt(deltaX * deltaX + deltaY * deltaY);

    if (euclidean < radiusLimit) {
      console.log("this is a click.");
    }
  }
});

var left=0，
top=0，
半径极限=5；
$（元素）({
mousedown：函数（事件）{
左=event.pageX；
top=event.pageY；
},
mouseup：函数（事件）{
var deltaX=event.pageX-左侧；
var deltaY=event.pageY-top；
var euclidean=Math.sqrt（deltaX*deltaX+deltaY*deltaY）；
if（欧几里德<半径极限）{
log（“这是一次单击”）；
}
}
});

我稍微修改了@adeneo的代码，因此它解决了用户“稍微”移动光标的问题，实际上应该解释为单击。我用了欧几里德距离。您可以删除

Math.sqrt

以获得更好的性能，但随后必须调整

radiusLimit

变量

var left = 0,
    top = 0,
    radiusLimit = 5;

$(element).on({
  mousedown: function(event) {
    left = event.pageX;
    top = event.pageY;
  },
  mouseup: function(event) {
    var deltaX = event.pageX - left;
    var deltaY = event.pageY - top;
    var euclidean = Math.sqrt(deltaX * deltaX + deltaY * deltaY);

    if (euclidean < radiusLimit) {
      console.log("this is a click.");
    }
  }
});

var left=0，
top=0，
半径极限=5；
$（元素）({
mousedown：函数（事件）{
左=event.pageX；
top=event.pageY；
},
mouseup：函数（事件）{
var deltaX=event.pageX-左侧；
var deltaY=event.pageY-top；
var euclidean=Math.sqrt（deltaX*deltaX+deltaY*deltaY）；
if（欧几里德<半径极限）{
log（“这是一次单击”）；
}
}
});

如果按下鼠标按钮，给他一些xanax！鼠标向下记录鼠标位置，然后单击比较。或者，在您的拖动功能中实现一个拖动事件，以便您可以在其中设置一个标志，然后在x ms后将其取消设置（10应该足以允许单击事件在取消设置之前发生）。如果按下鼠标按钮，请给他一些xanax！鼠标向下记录鼠标位置，然后单击比较。或者，在拖动功能中实现一个拖动事件，以便您可以在其中设置一个标志，然后在x ms后将其取消设置（10应该足以允许单击事件在取消设置之前发生）