ajax 自动完成下拉框自动提示位置问题

更新时间：2007年02月05日 00:00:00 作者：

            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' style='position:absolute;display:none;background:#E8F7EB;border: 1px solid #CCCCCC;font-size:14px;cursor: default;' 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">&nbsp;</td>       </tr>     </table>         <table border="1" align="center"  cellspacing="1" bordercolor="#9CD7FF"  id="table1" style="BORDER-COLLAPSE: collapse"  >           <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">&nbsp;</td>           </tr>         </table>       </td>   </tr> </table> </body>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

Ajax写分页查询（实现不刷新页面）
本文主要介绍了Ajax写分页查询（实现不刷新页面）的实例，具有很好的参考价值，下面跟着小编一起来看下吧
2017-03-03
利用iframe实现ajax跨域通信的实现原理(图解)
一般情况下都是用在同一域下的ajax请求；但是如果请求是发生在不同的域下，请求就无法执行，并且会抛出异常提示不允许跨域请求,接下来介绍利用iframe实现ajax跨域通信感兴趣的朋友可以了解下，或许对你学习ajax跨域有所帮助
2013-02-02
比较Ajax的三种实现及JSON解析
本文给大家介绍ajax的三种实现及json解析的相关资料，对本文感兴趣的朋友参考下
2015-12-12
Ajax在请求过程中显示进度的简单实现
ajax技术在web应用中使用非常频繁，本文以asp.net MVC为示例，提供一种简单的实现方式。ajax在请求过程中显示进度条，是怎么实现的呢？本文通过代码和文字说明相结合的方式分享给大家。
2015-09-09
Ajax中的循环方案
在开发中，当一个列表页面加载完成后，我需要根据列表每一项的id去服务器端获取对应的数据然后再把获取的数据赋给当前id对应的标签，怎么实现的呢？下面小编给大家介绍下ajax中的循环方案，感兴趣的朋友一起学习吧
2016-10-10
ajax动态查询数据库数据并显示在前台的方法
今天小编就为大家分享一篇ajax动态查询数据库数据并显示在前台的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-08-08
基于Ajaxupload的多文件上传操作
本文通过实例代码给大家介绍了基于Ajaxupload的多文件上传操作，代码简单易懂，非常不错，具有参考借鉴价值，需要的的朋友参考下吧
2017-08-08
Ajax in action 英文版配书源码下载
Ajax in action 英文版配书源码下载...
2007-05-05
asp.net 全部选中与取消操作,选中后的删除(ajax)实现无刷新效果
现在我们在编程的时刻总是要利用一些最新的技术去解决问题。。。。下面是我用ajax与jequery结合在一起使用的一个实例。希能给一起学习的朋友们带来帮助。
2009-06-06
Ajax实现页面无刷新留言效果
这篇文章主要为大家详细介绍了Ajax实现页面无刷新留言效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-12-12