Javascript addEventListener,仅跳转到最新事件(相同类型,'mousemove')并仅处理最新事件

时间:2018-01-24 04:45:06

标签: javascript events mousemove onmousemove

当我在Javascript中的事件循环中有几个相同类型的其他事件时,我想知道是否可以跳转并处理最新事件。我问这个因为,我做了一个Javascript程序,每次鼠标指针移动时都会报告'mousemove'事件。问题在于,由于某种原因,事件处理的速度并不快,我的PC或代码肯定不是问题。

我认为问题在于网络浏览器会限制每帧可以处理的'mousemove'事件的数量。因此,我不想处理队列中的所有事件,而是跳转到最新的事件并处理它并丢弃所有旧事件,而不是逐个执行所有事件。

我不确定这是否可以使用Javascript,所以这就是我寻求帮助的原因。

任何帮助都会非常感激......: - )

Here是我的应用。问题是,如果您尝试向上或向下移动窗口的标题栏区域太快,您将失去窗口本身的句柄。现在,这不应该发生在现代的GUI中。

更新'Debouncing'答案:

所以,有些人建议我应该使用去抖动功能。这不会解决我的问题。在最好的情况下,它只会延迟需要做的事情。所以,例如,如果我有一个像素在(4,0),如果我然后尝试将它向左移动3个像素到(1,0),那么它将以正常方式出现,但只是一点点延迟。也就是说,如果假设(我正在进行此操作)队列中的新'mousemove'事件每1 ms处理一次,并且代码在此示例中运行所需的时间为0 ms,并且在代码,我们设置函数,代码在处理新事件后执行2 ms。这将意味着确实只会处理最新事件,然后代码将在最新事件的侦听器函数开始运行后2 ms运行。因此,要将像素向左移动3个像素,这仍然需要5毫秒。那仍然是慢。我实际上需要用鼠标指针的坐标来更新我的Web应用程序,实际上是它的位置。

我的解决方案:

每次'mousemove'事件的侦听器开始执行时,我都应该从鼠标指针中获取坐标,而不是从事件的.clientX和.clientY属性中获取坐标。一旦'mousemove'事件被注册并且当时创建的事件对象(也没有达到),我应该从它们实际位于页面上而不是它们所在的位置处获取它们 - 鼠标指针的日期坐标)。我已经搜索了如何在没有实际事件对象的情况下获得实际鼠标指针坐标的解决方案,但到目前为止,我只阅读了关于它是不可能的响应。

This此人遇到与我完全相同的问题。我现在正在记录鼠标的全局(文档)位置,但应用程序的行为仍然是相同的。

1 个答案:

答案 0 :(得分:0)

我解决此问题的方法:

我已将'mousemove'和'mouseup'事件从拖动的对象移动到文档本身。