select下拉框多选

首先引入css 和 js 地址，下载地址

链接：https://pan.baidu.com/s/1G0gjJQt-OPJIqVDJbHCWLQ 
提取码：eywf 
将下载的三个文件引入到你自己的jsp中   路径一定要对

 设置样式

	.multiselect-container {
			height: 200px;
    		overflow-y: auto;
	}
	.multiselect-selected-text{
		color:white;
	}
	.multiselect-container{
		width: 189px;
	}

添加jsp代码

<label class="col-xs-6 form-group">
	<span>平级派发：</span>
	<select style="width:130px !important;"  id="levelDistribution" class="multiselect" multiple="multiple">
	</select>
</label>

初始化select

    initLevelDistribution();
	$('.multiselect').multiselect({         //.multiselect这个是select的class 也可以是id
		buttonClass: 'btn',
		buttonWidth: 130,
		buttonText: function(options) {
			if (options.length == 0) {
				return '请选择平级部门';
			}
			else {
				var selected = '';
				options.each(function() {  //遍历每一个option，每一次点击都会重新加载
					selected += $(this).text() + ','; //多选拼接方式
				});
				return selected.substr(0, selected.length -1) ; //去掉最后的,号
			}
		},
	});

添加js代码拼接select

//动态为select 添加数据
 function initLevelDistribution(){
 	$.ajax({
 		url : $.cxt + "/workOrder/levelDistributionInfo", 
 		type: "POST",
 		async:false,
 		data :{},
 		success : function(json) {
 			if("0" == json.code){
 				$("#levelDistribution").empty();
 				for(i=0;i<json.data.length;i++){
 					$("#levelDistribution").append(
 							$("<option>"+json.data[i].NAME+"</option>").val(json.data[i].ORG_ID)
 					)
 					
 				}
 				
 			}
 		}
 	})
 }

效果