取得html控件对象的top,和left

今天完善了一下ajax下拉选择框,在显示定位发现了一个小问题,所以备忘一下

一般情况要取得对象的离浏览器top和left只需要用objectID.offsetLeft和objectID.offsetTop就可以了
但如果该对象嵌套在其它容器(如div,table)里的话就不能直接这样取了,而要一个一个从里到外取,使用offsetParent循环取出直到nodeName不为body,最后再全都累加起来才是我们要的数据,例如有如下html代码:

  <table>
       <tr>
            <td><input id="aa" type="text" size="40"><a href='#' onclick="ShowSelectTable('aa')">选择</a></td>
       </tr>
  </table>

如果要得到aa的top和left就要取得
aa.offsetLeft
aa.offsetTop
        td.offsetLeft
        td.offsetTop
                table.offsetLeft
                table.offsetTop

思路清楚再看代码就清楚了:

//取得要显示的X,Y坐标
function fGetXY(aTag)
{
    var oTmp = aTag;
    var pt = new Point(0,0);
    do 
    {
        pt.x += oTmp.offsetLeft;
        pt.y += oTmp.offsetTop;
        oTmp = oTmp.offsetParent;
        alert(oTmp.nodeNames);
    } while(oTmp.tagName!="BODY");
    return pt;
}

//存放x,y坐标
function Point(iX, iY)
{
    this.x = iX;
    this.y = iY;
}

ajax选择下拉框添加了几个内容:
添加显示框自动定位
添加设置分页大小
添加可自定义皮肤路径
修复字段为空值时错误

源码:http://www.cnblogs.com/lxxnet/archive/2006/09/02/493050.html

演示地址:(由于是免费空间,有时速度可能会很慢)
http://xweex.a124.47data.com/index.html