1、下拉單選select2
渲染插件
<select class="selectpicker show-tick " data-live-search="true" style="width: 130px">
$(".selectpicker ").select2();
2、下拉多選select2
渲染插件
<select class="selectpicker show-tick " data-live-search="true" multiple style="min-width: 150px"></select>
$(".selectpicker ").select2();
給選擇框賦值（更新選項）
$("#departId ").select2().val(obj.departIds).trigger('change');
//分組多選
<select id="test" multiple="multiple">
<optgroup label="Group 1" class="group-1">
<option value="1-1">Option 1.1</option>
<option value="1-2" selected="selected">Option 1.2</option>
<option value="1-3" selected="selected">Option 1.3</option>
</optgroup>
<optgroup label="Group 2" class="group-2">
<option value="2-1">Option 2.1</option>
<option value="2-2">Option 2.2</option>
<option value="2-3">Option 2.3</option>
</optgroup>
</select>
3.下拉多選chosen.jquery
$(".group-select").chosen({
search_contains: true, //可以讓chosen搜索選項的中間及末尾字符
disable_search_threshold: 10 //select的option選項大於等於此值，才會顯示查詢的文本框
});
$(".group-select").trigger("liszt:updated");//更新選項
//分組多選
<select id="test" multiple="multiple">
<optgroup label="Group 1" class="group-1">
<option value="1-1">Option 1.1</option>
<option value="1-2" selected="selected">Option 1.2</option>
<option value="1-3" selected="selected">Option 1.3</option>
</optgroup>
<optgroup label="Group 2" class="group-2">
<option value="2-1">Option 2.1</option>
<option value="2-2">Option 2.2</option>
<option value="2-3">Option 2.3</option>
</optgroup>
</select>
4.下拉多選multiselect
$(".thirdVal.multiple").multiselect({
noneSelectedText: "請選擇",
selectedList: 1000000,
minWidth:150
});
//更新選項
$(".thirdVal.multiple").multiselect("refresh")
//分組多選
<select id="test" multiple="multiple">
<optgroup label="Group 1" class="group-1">
<option value="1-1">Option 1.1</option>
<option value="1-2" selected="selected">Option 1.2</option>
<option value="1-3" selected="selected">Option 1.3</option>
</optgroup>
<optgroup label="Group 2" class="group-2">
<option value="2-1">Option 2.1</option>
<option value="2-2">Option 2.2</option>
<option value="2-3">Option 2.3</option>
</optgroup>
</select>