html:
select2單選
<form class="form-horizontal" role="form" id="form">
<select id="singleSelect" name="singleSelect" data-placeholder=“請選擇” style="width:100%;"></select>
</form>
select2多選
<form class="form-horizontal" role="form" id="form">
<select id="mutiSelect" name="mutiSelect" multiple="multiple" data-placeholder=“請選擇” style="width:100%;"></select>
</form>
注意：placeholder屬性在select2插件初始化時無效，必須在html中寫入才有作用
js:
select2單選插件初始化
$('#singleSelect').select2({
data:[]
}).on('change', function() {
//$(this).valid();可以即時驗證
});
select2多選插件初始化
$('#mutiSelect').select2({
allowClear: true,
data:[]
}).on('change', function() {
//$(this).valid();可以即時驗證
});
注意：
data中格式為json數組[{id:1,text:選項1}，{id:1,text:選項2}]；
allowClear：允許清除選項
valid方法是jquery.validate.js中的方法，調用時需要初始化方法validate( )；而且由於使用select2美化select下拉列表后，select2會把原來的select隱藏掉，設置css屬性（display:none），然后再通過select2重新定制界面，且jquery.validate.js默認不是校驗:hidden屬性的控件，所以如果驗證select選擇框，需要在下面函數寫入ignore:""
$('#form').validate({
ignore:"",
rules: {
mutiSelect:{
required:true
}
},
messages: {
mutiSelect:{
required:"至少選擇一個模塊"
}
},
debug: false,
});
獲取select單選選中的值的id：
$("#singleSelect option:checked").val();
獲取select單選選中的值的text：
$("#singleSelect option:checked").text();
獲取select多選選中的值id：
$('#mutiSelect').select2('val');
獲取select多選選中的text值：
$('#mutiSelect option:checkd').text.join(",");
select2插件重新賦值data數據：
data中格式為json數組:data=[{id:1,text:選項1}，{id:1,text:選項2}]；
$('#singleSelect').select2({
data:data
});
select2插件賦值：
單選：var value = 1；
單選：var value1 = [1,2]；
$('#singleSelect').val(value).trigger('change');
$('#mutiSelect').val(value1).trigger('change');
如何不觸發select2給下拉框賦值:
$('#singleSelect').val(value).select();