【html】可输入可选择下拉框

别跟我讲需求！这是开发人员心里无时无刻不在呐喊的话哪。。。
这段时间公司在开发个b2b电商后台，需求人员和我们说，我这个下拉框是可以输入的哦！我当时一脸懵逼，我接触前端那么久，我就还没见过可输入可选择的下拉框，当时就感觉顿时丰富了我的三观。没办法，那就上网搜呗。。。费我九牛二虎之力

HTML：

<select class="form-control" id="spec_num0" name="spec_num" 
	onchange="document.getElementById('input0').value=$('#spec_num0 option:selected').text()">
	<option>金宇彬</option>
	<option>TOP</option>
</select>

<input id="input" class="form-control selectInput" name="input" placeholder="请选择"/>

CSS：

.selectInput{
	position:absolute; 
	margin-left:15px;
	padding-left:10px;
	width:130px;
	height:25px;
	left:1px;
	top:2px;
	border-bottom:0px;
	border-right:0px;
	border-left:0px;
	border-top:0px;
}

它的核心思想就是把input定位在select上，当select发生变化时把值放到input上，这就形成了可输入可选择下拉框的视觉感受啦。