select2使用

select2的使用记录

引入需要的css和js

<link href="../../../assets/plugins/select2/select2_metro.css" rel="stylesheet" type="text/css" />
<script src="../../../assets/plugins/select2/select2.min.js" type="text/javascript"></script>

html代码

<select id="sel_menu" class="form-control select2" name="pubArea" style="width: 100%;">
													<option value=""></option>
		</select>

js代码

function initSelect2WithSearch() {
			 $("#sel_menu").select2();
			var select=$("#sel_menu");
			select.select2({
				allowClear: true,
				 placeholder: "请选择或者搜索",
				escapeMarkup: function (m) {
					return m;
				}
			})
			
			
			$.myAjax({
							url: "http://192.168.12.197:8088/unit/findReleaseScopeUnits.action",
							type: "POST",
								data:{'unitId':"1","parentUnitId": "1",typeId: "1"}, 
							dataType: "json",
							async: false,
							success: function(res) {
								if(res.resultCode==200){
									for(let a=0;a<res.resultData.length;a++){
										select.append("<option value='" +res.resultData[a].id+ "'>"+res.resultData[a].name+ "</option>");
									}
								}
							}
						});
			
			
			
			}

其实也很简单，这是自带搜索的，下边是select2的根据value值选中的语法

//根据value的值选中select2对应value的值
select.val(value).trigger("change");