<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 } } }); }