拖动时的mouseUp事件 [英] mouseUp event on drag

问题描述

我有一个链接，它有mousedown和mouseup处理程序来为页面上的某些对象设置动画。
当拖动（拖放）链接触发mousedown事件但它在释放时不会触发mouseup。有这个问题的解决方法吗？

I have a link which has mousedown and mouseup handlers to animate some objects on page. When dragged (drag and drop) link fires mousedown event but it doesn't fire mouseup when released. is there a workaround for this problem?

这是一个例子，如果你正常点击链接它可以工作但是当你拖动链接鼠标时不会发生：

Here is a example, if you click link normally it works but when you drag the link mouse up doesn't happen:

http://jsfiddle.net/hL3mg/1/

推荐答案

处理拖拽

这里至关重要的人没有提及实际上是一个事件来记录拖动的结束，正如其他答案所解释的那样，这里发生了什么。该活动名为 dragend ，因此您只需

Handling drags

Something crucial nobody mentions here is that there actually is an event to register the end of a drag, which as explained by the other answers is what's happening here. The event is called dragend, so you can simply do

$("a").on("dragend",function(){
    console.log("Drag End");
});

注册拖动结束。这样做的缺点是你仍然会看到一个拖拽界面（换句话说：浏览器会显示一些UI来通知用户他的拖拽）。

To register the end of the drag. The disadvantage of this is that you will still see a drag interface (in other words: the browser will show some UI to notify the user he's draggin).

然而，还有一种方法可以注册鼠标升级，只需通过 return 取消拖动行为 false 在中点击事件监听器，然后注册 mouseup 文件。

There is however also a way to register the sought after mouse ups, simply cancel the drag behaviour by returning false in the click event listener, and then register the mouseup on the document.

$("a").mousedown(function(){
    console.log("Mouse Down");
    return false;
});

$(document).mouseup(function(){
    console.log("Mouse Up");
});

我觉得我必须做的唯一一句就是在一个独立的jsfiddle完全，在我自己的代码中它没有，所以我正在听 mouseup 和 dragend 只是为了肯定。

The only remark that I do feel like I have to make is that in a stand alone jsfiddle this worked perfectly, in my own code it did not, so I am listening for both the mouseup and the dragend just to be sure.

这篇关于拖动时的mouseUp事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！