有搜索功能的jquery下拉组件searchableSelect

一个带搜索框的jQuery下拉框美化插件 searchableSelect，使用起来非常简单。

使用步骤：

引入样式：

引入CSS 和 JS

<link rel="stylesheet" href="<%=request.getContextPath()%>/sys/oapublic/public/css/jquery.searchableSelect.css">
<script src="<%=request.getContextPath()%>/sys/oapublic/public/js/jquery.searchableSelect.js"></script>

如果已经引入jquery的包则不需要引入下面的js文件了

<script src="<%=request.getContextPath()%>/sys/oapublic/public/js/jquery-1.11.1.min.js"></script>

直接使用：

html代码：

<select  id="nextUserId">

      <option value="1">焦祖春（教务处）</option>

      <option value="2">王艺澄（教务处）</option>

      <option value="3">成浩（党政办公室，学工处，教务处，信息化管理处，国际交流学院）</option>

      <option value="4">周殿明（学工处）</option>

      <option value="5">蔡文娟</option>

      <option value="6">刘弋</option>

      <option value="7">李波（党政办公室，人事处）</option>

      <option value="8">贝蓓芝</option>      

      <option value="9">张军东</option>

      <option value="10">唐文杰</option>

......

</select>

//直接通过获取下拉的ID直接调用searchableSelect()方法就可以使用了

$("#nextUserId").searchableSelect();

效果图：