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

编程学习 2021-07-05 10:36www.dzhlxh.cn编程入门

代码如下:

            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]</div> </div>
        <div class="imoney"> 
         </div>
        <div class="nextlog"> 上一篇：<a href='/biancheng/181013.html'>完美ajax类　支持事件</a> 
          下一篇：<a href='/biancheng/181015.html'>纯AJAX分页，V0.2版 下载+演示</a>  </div>
        <div class="link-box">
          <h3>编程语言</h3>
          <ul class="ullist4">
            <li><i class="fa fa-caret-right"></i><a href="/biancheng/478810.html" title="服务器系统下载:服务器系统的安装">服务器系统下载:服务器系统的安装</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477817.html" title="学习编程先学什么">学习编程先学什么</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477440.html" title="数控机床编程与操作">数控机床编程与操作</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477439.html" title="什么是少儿编程？小孩子学编程忽悠人">什么是少儿编程？小孩子学编程忽悠人</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477438.html" title="孩子学编程一年要多少钱">孩子学编程一年要多少钱</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477437.html" title="孩子学编程的十大好处">孩子学编程的十大好处</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477436.html" title="学编程的最佳年龄">学编程的最佳年龄</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477435.html" title="初学编程100个代码大全">初学编程100个代码大全</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477434.html" title="让孩子学编程真是害了孩子">让孩子学编程真是害了孩子</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477433.html" title="学编程：究竟要学什么编程">学编程：究竟要学什么编程</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477432.html" title="编程主要是学哪些东西">编程主要是学哪些东西</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/477431.html" title="零基础了解编程和编程语言">零基础了解编程和编程语言</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/475452.html" title="电脑编程基础知识入门">电脑编程基础知识入门</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/475451.html" title="css样式列表有什么用">css样式列表有什么用</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/475450.html" title="css是脚本吗">css是脚本吗</a></li>
<li><i class="fa fa-caret-right"></i><a href="/biancheng/475449.html" title="什么是CSS语法？CSS使用方法及规则">什么是CSS语法？CSS使用方法及规则</a></li>

</ul>
        </div>
        <div id="pagenavi"> </div>       
      </div>
    </div>
    <ul id="sidebar">
  <li class="diyarea"> 
    <script src='/plus/ad_js.php?aid=3' language='javascript'></script> </li>
  <li class="rlist1">
    <h3><span>金源码搜索</span></h3>
    <div id="logsearch">
      <form name="keyform" method="get" action="/plus/search.php">
        <input type="hidden" name="pagesize" value="20">
        <input name="q" class="search" type="text" />
        <i class="fa fa-search" onclick="$('form').submit()"></i>
      </form>
    </div>
  </li>
  <li id="blogsort">
    <h3 class="mcolor"><i class="fa fa-folder-open-o"></i><span>金源码导航</span></h3>
  </li>
  <li class="rlist1">
    <h3><span>免费网站源码</span></h3>
    <ul id="newlog">
      <li><a href="/biancheng/478810.html">服务器系统下载:服务器系统的安装</a></li>
<li><a href="/biancheng/477817.html">学习编程先学什么</a></li>
<li><a href="/biancheng/477440.html">数控机床编程与操作</a></li>
<li><a href="/biancheng/477439.html">什么是少儿编程？小孩子学编程忽悠人</a></li>
<li><a href="/biancheng/477438.html">孩子学编程一年要多少钱</a></li>

</ul>
  </li>
  <li class="rlist1">
    <h3><span>网站模板下载</span></h3>
    <ul id="hotlog">
      <li><i class='mcolor' >1</i><a href="/biancheng/248521.html">少儿编程十大骗局</a></li>
<li><i class='mcolor' >2</i><a href="/biancheng/248522.html">正规少儿编程收费排名</a></li>
<li><i class='mcolor' >3</i><a href="/biancheng/475449.html">什么是CSS语法？CSS使用方法及规则</a></li>
<li><i  >4</i><a href="/biancheng/246563.html">新手怎么学网络编程</a></li>
<li><i  >5</i><a href="/biancheng/248518.html">网络编程是什么</a></li>

</ul>
  </li>
  <li class="rlist1">
    <h3><span>网站建设</span></h3>
    <ul id="randlog">
          <div id='tag1c9f85aa0e4328727b792315059d0d62'>
<li><a href="/biancheng/153480.html">JS版微信6.0分享接口用法分析</a></li>
<li><a href="/biancheng/176863.html">解析php dirname()与__FILE__常量的应用</a></li>
<li><a href="/biancheng/144171.html">ionic 自定义弹框效果</a></li>
<li><a href="/biancheng/128887.html">原生js实现瀑布流效果</a></li>
<li><a href="/biancheng/152551.html">一步一步封装自己的HtmlHelper组件BootstrapHelper（三</a></li>
    </div>

</ul>
  </li>
</ul>

</div>
</div>
<div id="footerbar">
<div class="wrap">
  <p>Copyright © 2016-2025  www.dzhlxh.cn  <a href="http://www.dzhlxh.cn/" target="_blank">金源码</a> 版权所有 Power by  </p>
  <p>网站模板下载|网络推广|微博营销|seo优化|视频营销|网络营销|微信营销|网站建设|织梦模板|小程序模板</p>
</div>
<script>
(function(){
    var bp = document.createElement('script');
    var curProtocol = window.location.protocol.split(':')[0];
    if (curProtocol === 'https') {
        bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';        
    }
    else {
        bp.src = 'http://push.zhanzhang.baidu.com/push.js';
    }
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(bp, s);
})();
</script>
<div id="backtop"><span class="fa fa-space-shuttle fa-rotate-270"></span></div>
</body>
</html>

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

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