实现一个下拉框输入内容进行模糊查询的功能

有个需求是这样的，页面有个字段是工作单位，大概有100多个进行选择所以要实现一个，根据输入内容进行模糊查询的功能各位大哥，有弄过的没，，，赶紧给出招啊。

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
    </head>
    <body>
            <input type="text" id="txtSearch" maxlength="50" />
            <input type="button" id="btnSearch" value="Search" /><br />
            <select id="selType">
                <option value="1">上海</option>
                <option value="2">北京</option>
                <option value="3">北京2</option>
                <option value="4">上海2</option>
                <option value="5">深圳</option>
            </select>
            <script type="text/javascript">
                window.onload = function() {
                    var txtSearch = document.getElementById("txtSearch");
                    var btnSearch = document.getElementById("btnSearch");
                    var selType = document.getElementById("selType").options;
                    var List = [];
                    for (var i = 0; i < selType.length; i++) {
                        List[i] = selType[i].value + "|" + selType[i].text;
                    }
                    btnSearch.onclick = function() {
                        var Html = "";
                        if (!(txtSearch.value.length < 1)) {
                            selType.length = 0;
                            for (var i = 0; i < List.length; i++) {
                                if (List[i].indexOf(txtSearch.value) > -1) {
                                    selType.add(new Option(List[i].split("|")[1], List[i].split("|")[0]));
                                }
                            }
                        }
                    };
                }
            </script>
    </body>
    </html>
      

  2.   

    http://www.alixixi.com/Down/Code/ajax/2008/2008070993183.html这里有实例，你自己研究吧