我正在开发一个支持在页面上拖动的网络应用程序，只需观察 mousedown/mousemove/mouseup 事件即可。这部分效果很好。
问题是我只处理在一个特定元素内部的拖动，按设计，如果用户（无意或无意）在外部拖动，它会在拖动模式下“卡住”。也就是说，鼠标按下，然后鼠标离开窗口，然后鼠标向上，然后鼠标返回到窗口，看起来它仍在拖动到我的应用程序。
我还没有想出任何方法来解决这个问题——甚至像“当鼠标重新进入窗口时，鼠标按钮是否按下？”这样简单的方法。会工作的。
是否存在这样的功能，而我只是想念它？或者我可以在这里采用一些聪明的解决方法？
旧版支持对我来说并不重要——如果它是一个仅适用于 FF3.5/Chr4/Sf4 的 HTML5 解决方案，我对此很满意。
【问题讨论】：
标签： html drag-and-drop
在 IE7/IE8 中，您可以使用以下代码检测鼠标是否释放到窗口外：
document.onmousemove = function(event) {
event = event || window.event;
if (document.all && event.button != 1) {
canceldragging();
}
}
在 Firefox 和 Webkit 中，当鼠标释放时，即使鼠标指针在浏览器窗口之外，也会在文档上触发 mouseup 事件。您可以使用http://www.quirksmode.org/dom/events/tests/click.html 看到这一点
对于 IE8，仅当鼠标按钮在浏览器窗口外释放时才会触发文档 onmouseup 事件如果您允许进行文档选择（如上面的链接）。也就是说，在 IE8 中，如果您使用 document.onselectstart 并取消选择，或者如果您在起始元素上使用 unselectable="on"，或者如果您调用 document.selection.clear() 组合，则不会收到 mouseup 事件鼠标按下时使用 document.selection.empty()。
【讨论】：
如果您让元素的 onmouseout 事件触发 mouseup 事件会怎样？
如果您只是使用内联处理程序，则类似于：
<div id='dragElement' onmouseup='alert("stop dragging!")' onblur='this.onmouseup();'></div>
添加到您已经在使用的任何事件处理代码中。每当元素失去焦点时，这将“释放”拖动。不是最干净的代码，但你明白了。
【讨论】：