jQuery模拟Select的Input下拉选择框
input 文本框的 select 效果，用 jQuery 搞定其实蛮。多时候你不想用原生的
核心思路其实就两步：一是点击事件控制列表显隐，二是列表项点选后把data-value赋值给input。像这样：
$('#simSelect').click(function() {
$('#optionsList').toggle();
});
$('#optionsList').on('click', 'li', function() {
var selectedOption = $(this).data('value');
$('#simSelect').val(selectedOption);
$('#optionsList').hide();
});啦，要是你想功能更全，比如支持搜索、支持多选，还能考虑用Select2或Chosen这些 jQuery 插件，封装得比较完善，用起来省事。
有一点要提醒：别忘了ul的定位样式，像position: absolute、z-index这些得配合好，不然弹出来就飞了。还有移动端适配，点了选不中，那体验就崩了。
如果你想继续优化，可以看看这些相关资源，灵感说不定就来了：
如果你在做个性化表单或者想自定义下拉样式，这招还挺实用，简单靠谱。
下载地址
用户评论
