确定事件之外的鼠标位置(使用 jQuery)?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/1133807/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 10:44:17  来源:igfitidea点击:

Determine mouse position outside of events (using jQuery)?

jqueryevent-handlingmouseposition

提问by pbz

I need to get a hold of the absolute mouse position / coordinates (X and Y) using (preferably) jQuery like in this tutorialbut outside of any JavaScript event. Thank you.

我需要像在本教程中一样使用(最好)jQuery 来获取绝对鼠标位置/坐标(X 和 Y),但在任何 JavaScript 事件之外。谢谢你。

回答by Chetan Sastry

Not possible. You can however use the same approach in the tutorial to store the position in a global variable and read it outside the event.

不可能。但是,您可以使用教程中的相同方法将位置存储在全局变量中并在事件之外读取它。

Like this:

像这样:

jQuery(document).ready(function(){
   $().mousemove(function(e){
      window.mouseXPos = e.pageX;
      window.mouseYPos = e.pageY;
   }); 
})

You can now use window.mouseXPosand window.mouseYPosfrom anywhere.

您现在可以从任何地方使用window.mouseXPoswindow.mouseYPos

回答by eyelidlessness

This started as a comment on Chetan Sastry's answer, but I realized it also might be worth posting as an answer:

这开始是对Chetan Sastry 的回答的评论,但我意识到它也可能值得发布作为答案:

I'd be careful about having a document-level, always-running mousemoveevent, even if you're only polling for cursor position. This is a lot of processing and can bog down any browser, particularly slower ones like IE.

mousemove即使您只是轮询光标位置,我也会小心处理文档级、始终运行的事件。这是大量的处理,可能会导致任何浏览器陷入困境,尤其是像 IE 这样速度较慢的浏览器。

A problem like this almost certainly raises the question of design decision: if you don't need to handle a mouse event to poll for the cursor position, do you really need the cursor position? Is there a better way to solve the problem you're trying to solve?

像这样的问题几乎肯定会引起设计决策的问题:如果您不需要处理鼠标事件来轮询光标位置,那么您真的需要光标位置吗?有没有更好的方法来解决您要解决的问题?

Edit: even in Safari 4, which is (understatement) very fast, that single mousemoveevent makes every interaction with that tutorial page noticeably choppy for me. Think about how that will affect users' perceptions of your site or application.

编辑:即使在(轻描淡写)非常快的Safari 4 中,该单个mousemove事件也使与该教程页面的每次交互对我来说都明显不稳定。想想这将如何影响用户对您的网站或应用程序的看法。

回答by Wahtah

This function will decrease the impact on UI performance by only getting the mouse position at an interval:

此函数将通过仅每隔一段时间获取鼠标位置来减少对 UI 性能的影响:

function getMousePosition(timeoutMilliSeconds) {
    // "one" attaches the handler to the event and removes it after it has executed once 
    $(document).one("mousemove", function (event) {
        window.mouseXPos = event.pageX;
        window.mouseYPos = event.pageY;
        // set a timeout so the handler will be attached again after a little while
        setTimeout(function() { getMousePosition(timeoutMilliSeconds) }, timeoutMilliseconds);
    });
}

// start storing the mouse position every 100 milliseconds
getMousePosition(100);

Just as in the other answer "You can now use window.mouseXPosand window.mouseYPosfrom anywhere."

就像在另一个答案中一样“您现在可以从任何地方使用window.mouseXPoswindow.mouseYPos”。

You lose a little accuracy as the mouse move won't be detected during the intervals.

由于在间隔期间不会检测到鼠标移动,您会失去一点准确性。

回答by Sword-Breaker

I have try @Chetan Sastry 's soulution,but it does't works.(I'm using jQuery 1.6.4). I change the code and then i works now. Here is my code. I hope this will help.

我尝试过 @Chetan Sastry 的解决方案,但它不起作用。(我使用的是 jQuery 1.6.4)。我更改了代码,然后我现在工作。这是我的代码。我希望这将有所帮助。



    $(document).ready(function(){
       $(document).mousemove(function(e){
          window.mouseXPos = e.pageX;
          window.mouseYPos = e.pageY;
       }); 
    });