Ajax省级三联动

js部分

varProvinceData=[];//接收后台传来的所有省市内容

var province=[];
var area=[];

//start选择省、市、区
functiongetCityData() {
   $.ajax({
      type: "GET",
      url: urlTest+"workOrderCommon/getAddressCodesPage",//访问的接口地址
      success: function(res) {
         if(res.status ==0) {
            ProvinceData = res.data;
            getProvince(ProvinceData);
         } else {
            alert(res.msg);
         }
      }
   });

}
//省
functiongetProvince(_data){//_data 是接口返回的树形的三级数据
   $.each(_data,function(i,value){
      var_obj={"id":value.id,"text":value.text}
      province.push(_obj);
   });
   varhtml="";

   $.each(province,function(i,value){
      html += "<option  value='"+ value.id +"' >" + value.text + "</option>"
     });
   $("#select6").html("<option>"+"选择省"+"</option>"+html);
   $("#select7").html("<option>"+"选择市"+"</option>");
    $("#select8").html("<option>"+"选择区"+"</option>");
}
//选择省后市的效果
    $("#select6").change(function(){
    varoSelect = document.getElementById('select6');
    var_num = oSelect.selectedIndex;
    varnum=_num-1;
    varhtml2="";
    varlength = (ProvinceData[num].children).length;
        for(vari=0;i<length;i++){
              html2 +="<option value='"+ProvinceData[num].children[i].id+"'>"+ProvinceData[num].children[i].text+"</option>";//根据下标查找传来的数据遍历取出结果
         }
         $("#select7").html("<option>"+"选择市"+"</option>"+html2);
         $("#select8").html("<option>"+"选择区"+"</option>");
 });

//选择市后县的效果
    $("#select7").change(function(){
    varprovinceNum = document.getElementById('select6');
    var_provinceNum = provinceNum.selectedIndex;//选择选中的select的下标
    varcityNum = document.getElementById('select7');
    var_cityNum = cityNum.selectedIndex;

    varhtml3="";
    area=ProvinceData[_provinceNum-1].children[_cityNum-1];
    varlength = (area.children).length;
        for(vari=0;i<length;i++){
              html3 +="<option value='"+area.children[i].id+"'>"+area.children[i].text+"</option>";
         }
    $("#select8").html("<option>"+"选择区"+"</option>"+html3);
 });

页面部分代码：

<div class="row">
    <span class="name"><sup class="imp">*</sup>服务地址</span>
    <select id="select6" class="Select">
    <option selected value="0">选择省</option>
    <!--<option value="1">山东省</option>-->

</select>
    <select id="select7" class="Select">
        <option selected value="0">选择市</option>
        <!--<option value="1">青岛市</option>-->

    </select>
    <select id="select8" class="Select">
        <option selected value="0">选择区</option>
        <!--<option value="1">崂山区</option>-->
    </select>
</div>

<div class="row">
    <span class="name"></span>
    <textarea name="" id="addressSummary" cols="30" rows="10" style="width:443px;height:80px"
              placeholder="请填写*路(街道/道路)*号小区*号楼*单元*室"></textarea>
</div>