JS——获取鼠标位置(坐标)

最新推荐文章于 2025-03-10 14:33:17 发布

转载最新推荐文章于 2025-03-10 14:33:17 发布 · 788 阅读

文章标签：

#JS 鼠标位置

js 专栏收录该内容

137 篇文章

订阅专栏

本文介绍了一种使用JavaScript来获取网页中鼠标当前位置的方法。通过监听鼠标移动事件并利用浏览器提供的API，可以精确地获得鼠标相对于页面的位置坐标。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script type="text/javascript">
// 说明：获取鼠标位置
// 整理：http://www.codebit.cn
// 来源：http://www.webreference.com
function mousePosition(ev){
   if(ev.pageX || ev.pageY){
     return {x:ev.pageX, y:ev.pageY};
   }
   return {
     x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
     y:ev.clientY + document.body.scrollTop - document.body.clientTop
   };
}
document.onmousemove = mouseMove;
function mouseMove(ev){
 ev = ev || window.event;
 var mousePos = mousePosition(ev);
   /*document.getElementByIdx('mouseXPosition').value = mousePos.x;
   document.getElementByIdx('mouseYPosition').value = mousePos.y;*/
   console.log(mousePos.x);
   console.log(mousePos.y);
}
</script>
</body>
</html>