效果图：
首先根据自己方法把地区树状结构json字符串拿到
html下拉框和js写法如下:
<select class="form-control" style="width: 140px" id="shi"name="shi" onchange="getDiquList(this.value,3);
changeList(this.value,‘shi‘)">
</select>
<select class="form-control" style="width: 140px" id="quxian"name="quxian"
onchange="getDiquList(this.value,4);changeList(this.value,‘quxian‘)">
</select>
<select class="form-control" style="width: 140px" id="xiangzhen"name="xiangzhen"
onchange="getDiquList(this.value,5);changeList(this.value,‘xiangzhen‘)">
</select>
<select class="form-control" style="width: 140px" id="dq5_id"name="dq5_id"
onchange="changeList(this.value,‘dq5_id‘)">
</select>
/******************* 省市县区域 开始 **************************/
function getDiquList(pid,dq_level) {
var dq_list = top.ajax.syncl("/sys/cs/project/system/diqu/getChildDiquList/"+pid,"")
switch(dq_level){
case 2:$(‘#shi‘).html(‘<option value="">请选择城市</option>‘).addOptions(dq_list,‘dq_id‘,‘dq_name‘);
$(‘#quxian,#xiangzhen,#dq5_id‘).html(‘<option value="">请选择</option>‘);break;
case 3:$(‘#quxian‘).html(‘<option value="">请选择区县</option>‘).addOptions(dq_list,‘dq_id‘,‘dq_name‘);
$(‘#xiangzhen,#dq5_id‘).html(‘<option value="">请选择</option>‘);break;
case 4:$(‘#xiangzhen‘).html(‘<option value="">请选择乡镇</option>‘).addOptions(dq_list,‘dq_id‘,‘dq_name‘);
$(‘#dq5_id‘).html(‘<option value="">请选择</option>‘);break;
case 5:$(‘#dq5_id‘).html(‘<option value="">请选择乡村</option>‘).addOptions(dq_list,‘dq_id‘,‘dq_name‘);
break;
}
}
/******************* 省市县区域 结束 **************************/
function changeList(value,item){
if(value == ‘‘){
con_map.remove(item);
}else{
con_map.put(item,value);
}
tp.curr_page=1;
loadListble();
}
function fnSearch(){
changeList($(‘#search_key‘).val(),‘kw‘);
}