searchableSelect 插件使用

<script type="text/javascript" src="//searchableSelect.js"></script>
<script>
	function getUserServer() {
     
     
	    var _this = '自定义封装接口请求、弹窗等方法';
	    _this.getAjax("get","//xxxxx/server", {
     
     }, function(res) {
     
     
	    	var data = res.data;
	        var serverList = "";
	        for(var i=0 ; i<data.length; i++){
     
     
	            serverList += '<option value="'+ data[i]['selectValue']+'">'
	            +	data[i]['selectName']
	            + '</option>';
	        }
	        var str = '<div>'
	        	+ '<div class="server">'
	        	+ 	'<label>select1：</label>'
	            + 	'<select id="userServer">'
	            + 		'<option value="">place select</option>'
	            + 		serverList
	            + 	'</select>'
	            + '</div>'
	            + '<div class="role">'
	            + 	'<label>select2：</label>'
	            + 	'<select id="userRole"><option value="">place select</option></select>'
	            + '</div>'
	            + '<a class="btn-alert " οnclick="paygift_new.bindRoleInfo()">确定</a>'
            	+ '</div>';
            _this.diyAlert({
     
      title: "select选择框", showhtml: str });
	        
	        $('#userServer').searchableSelect();
	        $('#userRole').searchableSelect();
	        $("#userServer .searchable-select-item").click(function () {
     
     
	            _this.getUserRole($(this).attr('data-value'))
	        });
	    });
	}
	//获取角色信息
	function getUserRole(value) {
     
     
		var _this = '自定义封装接口请求、弹窗等方法';
	    _this.getAjax("get","//xxxxx/role",{
     
     id:value},function(res) {
     
     
	    	var data = res.data;
	        var roleList = '';
	        for(var i=0 ; i<data.length; i++) {
     
     
	            roleList += '<option value="'+ data[i]['roleValue']+'">' + data[i]['roleName'] + '</option>';
	        }
	        $("#userRole .searchable-select").remove();
	        $('#userRole').html(roleList).searchableSelect();
	    });
	}
</script>

searchableSelect 源码

// Author: David Qin
// E-mail: david@hereapp.cn
// Date: 2014-11-05

(function($){
   
   

    // a case insensitive jQuery :contains selector
    $.expr[":"].searchableSelectContains = $.expr.createPseudo(function(arg) {
   
   
      return function( elem ) {
   
   
        return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
      };
    });
  
    $.searchableSelect = function(element, options) {
   
   
      this.element = element;
      this.options = options || {
   
   };