JS技术

Javascript获取某一标签的座标并返回其座标对象_javascript教程教程

字号+ 作者:H5之家 来源:H5之家 2015-10-03 10:12 我要评论( )

Javascript获取某一标签的座标并返回其座标对象,学习Javascript获取某一标签的座标并返回其座标对象,Javascript获取某一标签的座标并返回其座标对象,查看Javascr

昨天搞了一个日历选择器的小东西,竟然发现以前用的获取标签的座标的函数在Firefox下不能执行,比较郁闷。于是花心思整理了一个,现此代码支持Ie,Firefox,Opera,记录于此!

javascript获取座标
function getAbsPoint(e) {   
    var x = e.offsetLeft;   
    var y = e.offsetTop;   
    while(e = e.offsetParent) {   
        x += e.offsetLeft;   
        y += e.offsetTop;   
    }   
    return {"x": x, "y": y};   
}  


javascript获取座标使用方法
<html>  
<head>  
<meta http-equiv=content-type content="text/html; charset=UTF-8">  
<title>phplamp.org</title>  
<script type="text/javascript">  
function getAbsPoint(e) {   
    var x = e.offsetLeft;   
    var y = e.offsetTop;   
    while(e = e.offsetParent){   
        x += e.offsetLeft;   
        y += e.offsetTop;   
    }   
    return {"x": x, "y": y};   
}   
function phplamp(e) {   
    var xy = getAbsPoint(e);   
    alert("offsetLeft=" + xy.x + "\noffsetTop=" + xy.y);   
}   
</script>  
</head>  
<body>  
<input type="button" value="点击" />    
</body>  
</html>

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • js事件与处理_Javascript教程

    js事件与处理_Javascript教程

    2015-10-10 15:06

  • js对象属性及方法_Javascript教程

    js对象属性及方法_Javascript教程

    2015-10-10 15:04

  • js语句及语法_Javascript教程

    js语句及语法_Javascript教程

    2015-10-10 15:02

  • js数据类型与变量_Javascript教程

    js数据类型与变量_Javascript教程

    2015-10-10 15:00

网友点评