input框提示js，类似GOOGLE，可以做成动态的

input框提示js，类似GOOGLE，可以做成动态的

< script language = " javascript " >
var intIndex = 0 ;arrList  =   new  Array();
arrList[intIndex ++ ]  =   " 1sdfsdf.com " ;
arrList[intIndex ++ ]  =   " a11sdafs.net " ;
arrList[intIndex ++ ]  =   " b22dsafsdf " ;
arrList[intIndex ++ ]  =   " c333asdfsadf " ;
arrList[intIndex ++ ]  =   " 4444dsafasdf " ;
arrList[intIndex ++ ]  =   " dddsfddsafdsaf " ;
arrList[intIndex ++ ]  =   " 121213dsafsdaf " ;
arrList[intIndex ++ ]  =   " 43213asdfadsf " ;
arrList[intIndex ++ ]  =   " dsa3121dasf3 " ;
arrList[intIndex ++ ]  =   " a213 " ;
arrList[intIndex ++ ]  =   " 323313 " ;
arrList[intIndex ++ ]  =   " 3213 " ;
arrList[intIndex ++ ]  =   " 32213 " ;
arrList[intIndex ++ ]  =   " dsfsdddd " ;
arrList[intIndex ++ ]  =   " ds11dfsfd " ;
arrList[intIndex ++ ]  =   " ffdafd " ;
arrList[intIndex ++ ]  =   " afdfd " ;
arrList[intIndex ++ ]  =   " afd " ;
arrList[intIndex ++ ]  =   " baffad " ;
arrList[intIndex ++ ]  =   " 2fda2fd " ;
arrList[intIndex ++ ]  =   " dasd " ;

function test() {
    init();
    smanPromptList(arrList, " aspx " )
    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).toUpperCase() == strInput.toUpperCase()){
                                    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(){
                objouter.style.top     = getAbsoluteHeight(objInput) + getAbsoluteTop(objInput);
                objouter.style.left     = getAbsoluteLeft(objInput); 
                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() " >
</ body >
请输入内容：
< input type = " text "  id = " inputer " >  如 a 
< br >
< font color = " red " >
 改来改去还是只能用于一个文本框的下拉提示
</ font >

如果是两个的话就不能出来提示了呀。。。 < br >
< input type = " text "  id = " aspx " >< br >

< input type = " text "  id = " aspx2 " >< br >

多个文本框的下拉提示 还是没实现,
我的JS不好还请大家帮帮看看。我想

< font color = " red "   >
实现多个文本框都能下拉提示 怎么办啊。。。 < br >
</ font >