带搜索框的jQuery下拉框美化插件searchableSelect

本文是实用性更新文章：

1.所需引用

这里只需要在head内引入如下的代码：

<link href="jquery.searchableSelect.css" rel="stylesheet" type="text/css">
<script src="jquery-1.11.1.min.js">script>
<script src="jquery.searchableSelect.js">script>

ps:jquery-1.11.1.min.js 不必必须是这个版本的

2.页面代码

<div class="form-group">
    class="col-md-2 control-label" for="select">
        处理人:
    
    <div class="col-md-10" style="z-index: 9999; ">
        name=" " id="select-person" class="form-control"
        size="1">
            "">
                请选择
            
        
    div>
div>

ps:这里的可以定义任何的一个常规的select

3.为select添加搜索框

$('#select-person').searchableSelect();

ps:这里调用的是searchableSelect()函数，有兴趣的可以看下源码

---

关于动态赋值的问题

function setPerson() {
    $.ajax({
        type: "post",
        contentType: "application/json; charset=utf-8",
        url: " ",
        success: function(data) {
            var tbody = " ";
            $.each(data,
            function(n, value) {
                var trs = "";
                trs += "">" + value.user_name + "";
                tbody += trs;
            });
            $("#select-person").append(tbody);
            //这里需要其赋值然后调用构造
            $("#select-person").val("${problem.pro_solve_userid}");
            //添加带搜索框的下拉框
            $("#select-person").searchableSelect();
        },
    });
}

ps:这里采用的是先为其赋值，然后去构造searchableSelect