js获取区域坐标

原创

许琴 2012-08-09 10:13:09 博主文章分类：JS ©著作权

文章标签 js 坐标 文章分类 前端开发

©著作权归作者所有：来自51CTO博客作者许琴的原创作品，请联系作者获取转载授权，否则将追究法律责任

<html> 
<head> 
<script type="text/javascript">  
    function getCoordinates(e){ 
    x=e.clientX; 
    y=e.clientY; 
    document.getElementById("xycoordinates").innerHTML="当前坐标为: (X轴：" + x + ",Y轴：" + y + ")"; 
    } 
      
    function clearCoordinates(){ 
    document.getElementById("xycoordinates").innerHTML=""; 
    } 
</script> 
</head> 
 
<body> 
<div style="width:199px;height:99px;border:1px solid #c3c3c3" onmousemove="getCoordinates(event)" onmouseout="clearCoordinates()"></div> 
<div id="xycoordinates"></div> 
</body> 
</html>

这样更简单（整个页面坐标）：

<html> 
<head> 
<script type="text/javascript">  
    function getCoordinates(e){ 
        x=e.clientX; 
        y=e.clientY; 
        document.getElementById("xycoordinates").innerHTML="当前坐标为: (X轴：" + x + ",Y轴：" + y + ")"; 
    } 
</script> 
</head> 
 
<body onmousemove="getCoordinates(event)"> 
    <div id="xycoordinates"></div> 
</body> 
</html>