jQuery select2设置默认值从列表中的一个选项

<link href="/static/jquery-select2/3.4/select2.min.css" rel="stylesheet" />
<script src="/static/jquery-select2/3.4/select2.min.js" type="text/javascript"></script>
<link href="/static/bootstrap/2.3.1/css_cerulean/bootstrap.min.css" type="text/css" rel="stylesheet" />
<script src="/static/bootstrap/2.3.1/js/bootstrap.min.js" type="text/javascript"></script>

 

由于在bootstrap框架中jquery-select2好像是有个外壳保护着的，用一般的jq ：$("#area").find("option[text='pxx']").attr("selected",true);是无法给select设置选中的，要用select2内嵌的方法来设置$(“#area").select2().select2('val', val)，val为option选项的value，而在给select添加选项的时候$("#area").append("<option value='"+item.id+"'>"+item.name+"</option>")，还要在在最后添加一句

$("#area").change();告诉select2框架代码已经更新了，需要重载。这样才能正确显示。

 

function getArea(areaId){
		$.ajax({
			url:"/***?areaId="+areaId,
			type:'get',
			dataType:'json',
			success:function(data){
				try {
					$("#area").empty();//	清空下拉列表
					if(data){//判断服务器返回的值是否为空
					$(data).each(function (i,item){                                     
                                              if(i==1){		
                                                     $("#"+selectId).select2().select2('val', item.id)//设定select 中的selected					    }
						     $("#area").append("<option value='"+item.id+"'>"+item.name+"</option>");
						      //给select 设定选项                                                })
					}else{
						$("#area").append("<option value=''>-- 请选择 --</option>");
					}
					$("#area").change();//告诉select2代码已经更新，需要重载
				} catch (e) {
					// TODO: handle exception
				}
			}
		});
	}