ajax 自動完成下拉框 自動提示位置問題_AJAX相關

複製代碼 代碼如下:

            function divPosition(){
                var clx,cly;
                clx=event.clientX;
                cly = event.clientY;
                objouter.style.top    = clx+10;
                objouter.style.left    = cly+20; 
                objouter.style.width= getAbsoluteWidth(objInput)
            }

問題出在
                objouter.style.top    = clx+10;
                objouter.style.left    = cly+20; 
                objouter.style.width= getAbsoluteWidth(objInput);
如果改成getAbsoluteTop(objInput);
getAbsoluteLeft(objInput);
在表格裡的文字框輸入東東就死IE了
但我不知道怎麼改

層的位置不對 <script language="javascript"> var intIndex=0;arrList = new Array(); function dearray(aa)//定義array { //document.write(aa); arrList = aa.split(','); intIndex = arrList.length； } function test() { init(); dearray("asp,csdn,aaaa,bbbbc,afd,werwe,adfs,ertr,qwq,qwqwq,trt,uyus,dsfs,uere,add,234,2,1dr4,ae4564,adf4645,afa3543,sdfse5,ae345345,sdf4564,34346536"); smanPromptList(arrList,"aspx"); dearray("1sdfsdf.com,a11sdafs.net,b22dsafsdf,c333asdfsadf,4444dsafasdf,dddsfddsafdsaf,121213dsafsdaf,43213asdfadsf,dsa3121dasf3,a213,323313,3213,32213,dsfsdddd,ds11dfsfd,ffdafd,afdfd,afd,baffad,2fda2fd,dasd"); smanPromptList(arrList,"aspx2"); smanPromptList(arrList,"inputer") } function init() { if (arrList.constructor!=Array){alert('smanPromptList初始化失敗:第一個參數非數組!');return ;} arrList.sort( function(a, b) { if(a.length>b.length)return 1; else if(a.length==b.length)return a.localeCompare(b); else return -1; } ); } function smanPromptList(arrList,objInputId){ var objouter=document.getElementById("__smanDisp") //顯示的DIV對象 var objInput = document.getElementById(objInputId); //文字框對象 var selectedIndex=-1; var intTmp; //迴圈用的:) if (objInput==null) {alert('smanPromptList初始化失敗:沒有找到"'+objInputId+'"文字框');return ;} //文字框失去焦點 objInput.onblur=function(){ objouter.style.display='none'; } //文字框按鍵抬起 objInput.onkeyup=checkKeyCode; //文字框得到焦點 objInput.onfocus=checkAndShow; function checkKeyCode(){ var ie = (document.all)? true:false if (ie){ var keyCode=event.keyCode if (keyCode==40||keyCode==38){ //下上 var isUp=false if(keyCode==40) isUp=true ; chageSelection(isUp) }else if (keyCode==13){//斷行符號 outSelection(selectedIndex); }else{ checkAndShow() } }else{ checkAndShow() } divPosition() } function checkAndShow(){ var strInput = objInput.value if (strInput!=""){ divPosition(); selectedIndex=-1; objouter.innerHTML =""; for (intTmp=0;intTmp<arrList.length;intTmp++){ if (arrList[intTmp].substr(0, strInput.length)==strInput){ addOption(arrList[intTmp]); } } objouter.style.display=''; }else{ objouter.style.display='none'; } function addOption(value){ objouter.innerHTML +="<div onmouseover=\"this.className='sman_selectedStyle'\" onmouseout=\"this.className=''\" onmousedown=\"document.getElementById('"+objInputId+"').value='" + value + "'\">" + value + "</div>" } } function chageSelection(isUp){ if (objouter.style.display=='none'){ objouter.style.display=''; }else{ if (isUp) selectedIndex++ else selectedIndex-- } var maxIndex = objouter.children.length-1; if (selectedIndex<0){selectedIndex=0} if (selectedIndex>maxIndex) {selectedIndex=maxIndex} for (intTmp=0;intTmp<=maxIndex;intTmp++){ if (intTmp==selectedIndex){ objouter.children[intTmp].className="sman_selectedStyle"; }else{ objouter.children[intTmp].className=""; } } } function outSelection(Index){ objInput.value = objouter.children[Index].innerText; objouter.style.display='none'; } function divPosition(){ var clx,cly; clx=event.clientX; cly = event.clientY; objouter.style.top = cly+10; objouter.style.left = clx+20; objouter.style.width= getAbsoluteWidth(objInput) } } document.write("<div id='__smanDisp' onbulr> </div>"); document.write("<style>.sman_selectedStyle{background-Color:#102681;color:#FFFFFF}</style>"); function getAbsoluteHeight(ob){ return ob.offsetHeight } function getAbsoluteWidth(ob){ return ob.offsetWidth } function getAbsoluteLeft(ob){ var mendingLeft = ob .offsetLeft; while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" ){ mendingLeft += ob .offsetParent.offsetLeft; mendingOb = ob.offsetParent; } return mendingLeft ; } function getAbsoluteTop(ob){ var mendingTop = ob.offsetTop; while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" ){ mendingTop += ob .offsetParent.offsetTop; ob = ob .offsetParent; } return mendingTop ; } </script> <body onLoad="test()"> 下拉提示跟著 MOuse 走的。。想把他改成在文字框下出來的那種怎麼改 <input type="text" id="aspx"> <input type="text" id="aspx2"> <table width="970" border="0" align="center"> <tr> <td><table width="100%" border="0" align="center"> <tr> <td align="center" valign="middle"> </td> </tr> </table> <table border="1" align="center" cellspacing="1" bordercolor="#9CD7FF" id="table1" > <tr bgcolor="#99CCFF"> <td bgcolor="#CEE3FF"><font class="text">日期</font></td> <td bgcolor="#FFFFFF"><input type="text" id="inputer"></td> </tr> <tr bgcolor="#99CCFF"> <td bgcolor="#CEE3FF"><font class="text">製造號碼</font></td> <td bgcolor="#FFFFFF"></td> </tr> <tr bgcolor="#99CCFF"> <td height="24" bgcolor="#CEE3FF"><font class="text">作業內容</font></td> <td height="24" bgcolor="#FFFFFF"> </td> </tr> </table> </td> </tr> </table> </body>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]