可输入下拉框

效果图可输入下拉框可输入下拉框

 

原理:在下拉框前面加多一个input输入框,把下拉框的值赋给input

需要给input加入样式,让input跟下拉框对齐

 

HTML代码:

<select id="vehicleAgent">
                <option value="">--请选择--</option> <option value="">1</option>
                <option value="">2</option><option value="">3</option>
</select> 
<input id="agentNameInput" type="text" value="">

 

JS代码:

var vehicleApplyTest = (function() {
    return {
        writeSelect : function(){
            $("#vehicleAgent").change(function(){  //下拉框内容改变触发方法
                var aname = $("#vehicleAgent").val();  //获取下拉框的值
                $("#agentNameInput").attr("value",aname);//给input的value赋值
            });
        }

  }
})();
$(document).ready(function() {
    vehicleApplyTest.writeSelect();
});