下拉框可以输入

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);
 }
 });
 }