JavaScript 中 mousemove 的触发是如何工作的？

发布于 2024-11-06 08:34:55 字数 364 浏览 2 评论 0原文

我有一个对象，可以在每次鼠标移动时打印鼠标的 x 和 y 位置。

事情是这样的：

$('#canvas').mousemove(function(e){
    $('#output').prepend(e.pageX + ',' + e.pageY);
});

我注意到，当你非常快地在对象上移动时，它只会打印出几个位置。

我并不完全不高兴它这样做（因为让它为你跨越的所有数百个像素做一些事情会非常详尽），但我想知道这是如何工作的。

mousemove 事件是否限制为每秒一定数量的触发次数？

（顺便说一句：这是在 Ubuntu Linux 中的 Chromium 上测试的）

原文

I have an object that prints the mouse's x and y positions on every mousemove.

It's something like this:

$('#canvas').mousemove(function(e){
    $('#output').prepend(e.pageX + ',' + e.pageY);
});

I've noticed that when you move over the object really fast it only prints out a few positions.

I'm not exactly unhappy that it does that (because it would be quite exhaustive to have it do something for all the hundreds of pixels you've crossed) but I am wondering how this works.

Is the mousemove event limited to a certain amount of triggers per second or what?

(Btw: this was tested on Chromium in Ubuntu Linux)

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

欲拥i 2024-11-13 08:34:56

您可能想看看这个，因为这可能取决于浏览器，

http ://javascript.info/tutorial/mouse-events#mousemove-and-mouseover-Frequency，但是，如果您查看此问题，就会发现有关如何获得更好响应的建议。

如何设置鼠标移动更新速度？

回复收藏 0 原文

暖伴 2024-11-13 08:34:56

我认为这是同步的。它不会为您移动鼠标的每个像素触发，这意味着事件不会排队。

假设你有一些像这样的代码。

$('#canvas').mousemove(function(e){
//Some code which takes seconds to execute 
//All subsequent events won't be dispatched while this event handler is executing. 
});

假设您在鼠标移动事件处理程序执行时移动鼠标。 mousemove 处理程序不会被触发。

这是处理程序的示例，执行需要几秒钟。 --> http://jsfiddle.net/78Hf3/1/

而且只需要很少的时间 --> ; http://jsfiddle.net/78Hf3/2/

i think it's synchronous. It's doesn't get triggered for every pixel in which you move your mouse, which means that the events are not queued up .

Say if you have some some code like this.

$('#canvas').mousemove(function(e){
//Some code which takes seconds to execute 
//All subsequent events won't be dispatched while this event handler is executing. 
});

Say if you move mouse while the mouse move event handlers execute. The mousemove handler won't be triggered.

Here is a example for handler which will take seconds to execute. --> http://jsfiddle.net/78Hf3/1/

And one that take only few time --> http://jsfiddle.net/78Hf3/2/

回复收藏 0 原文