100分:绝对高难度的控件位置问题

Question

页面上有一个div 宽和高都是500px，div中的内容很多，超出了500*500的显示范围，超出部分用滚动条，现在在div中有一个
textbox，属于超出的位置，即要向下滚动“滚动条”才能看到，现在我想获得textbox距窗体顶部的距离，这个距离随滚动条的滚动应该是变化的，而我现在用
function SetXY(Obj) {
  for(sumTop = 0, sumLeft = 0; Obj != document.body; sumTop += Obj.offsetTop, sumLeft += Obj.offsetLeft, Obj=Obj.offsetParent);
}
这个方法得到的位置是不变化的，这个不是我要的结果，我想要能变动的位置，怎么获得？背景：我做了个自动完成的功能，在页面上有divDetail，其中有很多条记录，超出的以滚动条方式显示，每条记录第一列是textbox，输入时有自动提示功能，我想把自动提示框divTip定位显示在当前textbox下面答对加分

Answer 1

你可以先获取得TextBox与窗体顶部的距离H,这个是不变化的
再获取滚动条下拉的距离L,这个是会变化的
H-L应该就是你要的距离了

Answer 2

添加滚动条事件，
onscroll="onscrollform();"   onload="formOnload();"   

Answer 3

function test(){
var o = document.getElementById("t");
var rect = o.getBoundingClientRect();//返回一个TextRectangle对象，包含left, top, right和bottom几个只读属性，以px为单位来表示边界框相对视窗左上角的位置。
var iLeft1 = rect.left-document.documentElement.clientLeft, iTop1 = rect.top-document.documentElement.clientTop;var iLeft2 = o.offsetLeft, iTop2 = o.offsetTop;
while (o.offsetParent) { o = o.offsetParent; iLeft2 += o.offsetLeft; iTop2 += o.offsetTop; }
iLeft2 -=document.documentElement.scrollLeft;
iTop2 -=document.documentElement.scrollTop;
alert(iLeft1+"_"+iLeft2)
alert(iTop1+"_"+iTop2)
}试试getBoundingClientRect()方法

Answer 4

function SetXY(Obj) { 
  for(sumTop = 0, sumLeft = 0; Obj != document.body; sumTop += Obj.offsetTop, sumLeft += Obj.offsetLeft, Obj=Obj.offsetParent);
//这里sumTop -= div.scrollTop;
//sumLeft -= div.scrollLeft;
}