在Javascript中捕获setInterval()上的鼠标位置

时间:2009-10-22 16:43:50

标签: javascript javascript-events mouseevent

我在javascript中有一个函数,根据鼠标位置移动一个div。此函数在setInterval()函数上设置并每秒执行一次。我需要像这样捕获鼠标位置:

function mousemov() {
  document.getElementById("myDiv").style.left = Event.clientX; //don't work
}

window.onload = function() {
  setInterval("mousemov()",1000);
}

Ps:我无法使用mousemove事件,因为即使鼠标停止也必须执行该功能。

感谢您的帮助!

2 个答案:

答案 0 :(得分:8)

您可以访问事件对象的唯一时间是在执行事件处理程序期间。因此,您需要做的是在文档上创建OnMouseMove事件,并将鼠标坐标存储在全局可访问的对象中。然后,您可以从脚本中的任何其他位置访问这些值,以确定鼠标位置。

这是一个例子(你没有使用jQuery,所以这是直接的DOM代码):

document.onmousemove = function(e) {
    var event = e || window.event;
    window.mouseX = event.clientX;
    window.mouseY = event.clientY;
}

function mousemov() {
    document.getElementById("myDiv").style.left = window.mouseX;
}

window.onload = function() {
    setInterval(mousemov, 1000);
}

我应该注意clientX和clientY不考虑滚动。您需要检索滚动偏移并将它们应用于返回的值。

答案 1 :(得分:1)

好吧,如果您听取鼠标移动文档并保存其位置,那么,只要您愿意,例如在你的情况下你每秒都有最新注册的鼠标位置。

这是一个jquery示例

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

并且你的mousemove函数将是

function mousemov() { 
    document.getElementById("myDiv").style.left = window.mouseX;
}