select2 下拉框插件简单例子（jquery）

我一般用他来做多选下拉框，如图

首先写一个<select>标签：jc_selDept
 
<td class="formValue">
	<input type="text" id="jc_smallDept" name="jc_smallDept" style="display:none;" />
	<input type="text" id="jc_sdeptName" name="jc_sdeptName" style="display:none;" />
	<!-- 上面两个标签可以用来存select的val和text -->
	
	<select id="jc_selDept" name="jc_selDept" multiple></select>
</td>
 复制

然后js里面初始化插件：

//用ddata数据初始化多选下拉框
$("#jc_selDept").select2({
	placeholder: '请选择',
	data: ddata,
	multiple: true,
    maximumSelectionLength: 2,
	minimumResultsForSearch: -1
});
 
这里面的ddata是一个数组，如
var ddata = [{ id: 1, text: '部门1'},{ id: 2, text: '部门2'},{ id: 2, text: '部门3'}];
这个ddata可以用ajax获取后台数据。复制

读取select2的选中项：

var selObj = $('#jc_selDept').select2('data');  //选中项，是一个数组
var sted = '';
var stxt = '';
 
$.each(selObj, function (ind, val) {
	sted += val.id; 
	stxt += val.text; 
	//可以用foreach循环读取出选中项
});复制

赋值select2选中项

arr = F_JC_DeptCode.split(",");   //用逗号隔开的字符串
$('#jc_selDept').val(arr).trigger('change'); 复制

清空select2选中项

$('#jc_selDept').val(null).trigger('change'); 复制