textbox中输入字符在下拉框中联想

页面上有两个控件textbox和dropdownlist控件，页面加载的时候在下拉框中绑定了数据，在textbox中输入内容后，在下拉框中寻找匹配的内容，类似于联想的功能，但页面不能有刷新，小弟JS很菜，写不出来，请大家帮帮忙。

解决方案 »

  1.   


    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>Test</title>
    </head>
    <body>
    <input type="text" value="" id="txtTest" onkeyup="Test();">
    <select id="selectTest">
    <option value="0">选择项</option>
    <option value="1">abc</option>
    <option value="2">def</option>
    </select>
    <script type="text/javascript">
    function Test(){
    var obj=document.getElementById("txtTest").getAttribute("value");
    var select=document.getElementById("selectTest");
    var temp=0;
    for(var i=0;i<select.options.length;i++){
      if(select.options[i].innerText==obj){
        temp=i;
    break;
      }
    }
    select.options[temp].selected=true;
    }
    </script>
    </body>
    </html>
      

  2.   

    innerText 兼容性不太好吧～！
      

  3.   

    <script type="text/javascript">
    var a=["11","34","2","22","56"];
    function finds(){
    var see=document.getElementById("se");
    var tee=document.getElementById("te");
    see.length=0;
    var value1=tee.value;
    for(var i=0;i<a.length;i++){
    if(a[i].indexOf(value1)==0){
    var o=new Option(a[i],a[i]);
    see[see.length]=o;
    }
    }

    }
    </script>
    </head><body>
    <input type="text" onkeyup="finds()" id="te"><br/>
    <select id="se" size="2"></select>
    </body>
    大体做了下  你改改 感觉思路差不多吧
      

  4.   

    var a=["2","22","2222","222222","222222","2222"];
    function finds(){
    var see=document.getElementById("se");
    var tee=document.getElementById("te");
    see.length=0;
    var value1=tee.value;
    for(var i=0;i<a.length;i++){
    if(a[i].indexOf(value1)==0){
    var o=new Option(a[i],a[i]);
    see[see.length]=o;
    }
    }
    see.size=see.length;
    }
    通过设置下拉框的size属性