下拉框可以輸入

1.效果圖


2.實現方法
*方法1：*select選擇框控件-jquery.editable-select

<select id="editableTest">
    <option value="1">aaa1 Romeo</option>
    <option value="2">aaa2</option>
    <option value="3">aaa3</option>
    <option value="4">aaa4</option>
</select>
js:
$('#editableTest').editableSelect();

方法2：select2（更加強大的方法）
大牛博客：http://www.cnblogs.com/landeanfen/p/5099332.html
官方地址：https://select2.github.io/examples.html
本人方法：

<select id="selectAA" class="js-data-example-ajax form-control" style="width: 200px;"  >
                        <optgroup  label="名字" id="Name">
                            <option value="ALL" >全部同學</option>
                        </optgroup>
                    </select>
js:
$("#selectAA").select2(); 
    /*給下拉框賦值*/
    function getTONGXUE(){
        $.ajax({
            type:'post',
            data:'',
            url:'xxxxx',
            success:function(result){
                var data=eval("("+result+")");
                var str="";
                if(data!=null && data!=undefined){
                    for(var i=0;i<data.length;i++){
                        str+="<option value="+data[i].Age+">"+data[i].Name+"</option>";
                    }
                }
                $("#Name").append(str);
            }
        });
    }