在页面中js获取光标/鼠标的坐标及光标的像素坐标

392 阅读 0 评论 259 点赞

我是靠谱客的博主甜蜜老师，最近开发中收集的这篇文章主要介绍在页面中js获取光标/鼠标的坐标及光标的像素坐标，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

近期为网站开发页面统计，以前虽然也开发过，但是功能不是很全，所以这次把一些好功能给用上。

例如这次的，页面JS光标/鼠标坐标，你也许问着有什么用，百度统计中有个热点统计图，这下清楚明白了吧。

好了，上肉：
功能：获取光标的像素坐标

复制代码代码如下:

 
<html> 
<head> 
<script type="text/javascript"> 
function showPosition(e){ 
var x,y; 
var e = e||window.event; 

document.getElementById("x").value = e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft; 
document.getElementById("y").value = e.clientY+document.body.scrollTop+document.documentElement.scrollTop 

} 
</script> 
</head> 
<body> 
<div onmousemove="showPosition(event);" style="height:100%; width:100%;"> 
x:<input id="x" type="text" value="" /> 
y:<input id="y" type="text" value="" /> 
</div> 
</body> 
</html> 