方法一：html5 自带的datalist实现：
html代码：
<input list="students">
<datalist id="students">
<option value="Lily">
<option value="Lucy">
<option value="Jim">
</datalist>
效果如下：
image.png
方法二：通过CSS的调试使input和select重合，去除input边框。再给select加上change事件，给input赋值。
html代码：
<select id="select" style="width:150px;height:30px;border-radius: 3px;" onchange="change(this)">
<option value="1">测试数据1</option>
<option value="2">数据2</option>
</select>
<input id="datashow" style="width:128px;height: 26px;margin-left: -150px;border:none;" type="text" value>
js代码：
function change(obj){
var value = $(obj).find('option:selected').text();
$('#datashow').val(value);
}
网友评论