2025-01-05 10:00:02

跟踪鼠标位置

我希望跟踪鼠标光标的位置,周期性地每t秒。因此,从本质上讲,当一个页面加载时,这个跟踪器应该开始,(比如说)每100毫秒,我应该得到posX和posY的新值,并将其打印到表单中。

我尝试了下面的代码-但值不会刷新-只有posX和posY的初始值显示在表单框中。有什么办法能让它运行起来吗?

<html>
<head>
<title> Track Mouse </title>
<script type="text/javascript">
function mouse_position()
{
    var e = window.event;

    var posX = e.clientX;
    var posY = e.clientY;

    document.Form1.posx.value = posX;
    document.Form1.posy.value = posY;

    var t = setTimeout(mouse_position,100);

}
</script>

</head>

<body onload="mouse_position()">
<form name="Form1">
POSX: <input type="text" name="posx"><br>
POSY: <input type="text" name="posy"><br>
</form>
</body>
</html>

当前回答

onmousemove = function(e){console.log("mouse location:", e.clientX, e.clientY)}

打开控制台(Ctrl+Shift+J),复制粘贴上面的代码,并在浏览器窗口上移动鼠标。

其他回答

我认为我们想太多了,

函数mouse_position (e) { / /做东西 } <身体onmousemove = " mouse_position(事件)" > < /身体>

这是获取鼠标指针坐标的最短方法。 只需将元素放在光标所在的位置,在$("")内

 $("***enter you element here***").mousemove(function(event)
{
 console.clear()
  var x = event.originalEvent.screenX;
  var y = event.originalEvent.screenY;
  console.log("x : "+x)
  console.log("y : "+y)
})

最近,我们必须找到当前的x,y位置,以枚举光标所悬停的元素,而不依赖于z-index。我们最终只是附加了一个鼠标移动事件监听器到文档,例如,

功能findElements(e) ( var els =文档。clientX, clientY); 和els一起做酷的东西 游戏机。log (els); return; ) 文档。addEventListener (mousemove”、“findElements);

无论使用哪种浏览器,以下几行都能让我获取正确的鼠标位置。

事件。clientX - event.currentTarget.getBoundingClientRect().left 事件。clientY - event.currentTarget.getBoundingClientRect().top

这里有一个解决方案

document.onmousemove = showCoords;
function showCoords(event) {
var x = event.clientX;
var y = event.clientY;
var coords = "X coords: " + x + ", Y coords: " + y;
document.getElementById("box1").innerHTML = coords;
}