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

时间:2021-03-17 人气:0

想了解ajax 自动完成下拉框自动提示位置问题的相关内容吗，在本文为您仔细讲解的相关知识和一些Code实例，欢迎阅读和指正，我们先划重点：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() 
            }

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">

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

加载全部内容

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

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