官方下载地址
https://developer.snapappointments.com/bootstrap-select/
需求现在需要下拉框，并且在下拉框上能输入文字搜索。
因为前端框架使用的时bootstrap所以有限考虑与bootstrap有关的前端插件。
最后选中bootstrap-select。
使用
<link href="../bootstrap/bootstrap-select/bootstrap-select.min.css" rel="stylesheet" />
<script src="../bootstrap/bootstrap-select/bootstrap-select.min.js"></script>
带搜索框的
<select class="selectpicker" data-live-search="true">
<option>四川(sichuan)</option>
<option>江西(jiangxi)</option>
<option>湖北(hubei)</option>
<option>上海(shanghai)</option>
<option>北京(beijing)</option>
<option>河北(hebei)</option>
</select>
不带搜索框的
<select class="form-control" data-live-search="true" >
<option>四川(sichuan)</option>
<option>江西(jiangxi)</option>
<option>湖北(hubei)</option>
<option>上海(shanghai)</option>
<option>北京(beijing)</option>
<option>河北(hebei)</option>
</select>
bootstrap-select长度失真
调试chrom浏览器发现bootstrap的css样式导致出现问题
解决方法：在jsp页面重新定义冲突的样式，然后给它合适的height
<style type="text/css">
button,
input,
optgroup,
select,
textarea {
height:30px;
margin: 0;
font: inherit;
color: inherit;
}
</style>
bootstrap-select 在model中不显示
查找原因后是得有两步refresh和render操作，必不可少
<select id='name' class="form-control selectpicker" data-live-search="true">
<option>四川(sichuan)</option>
<option>江西(jiangxi)</option>
<option>湖北(hubei)</option>
<option>上海(shanghai)</option>
<option>北京(beijing)</option>
option>河北(hebei)</option>
</select>
// 缺一不可
$('#name').selectpicker('refresh');
$('#name').selectpicker('render');