【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>TOPoption>
select>
"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上，这就形成了可输入可选择下拉框的视觉感受啦。