简单方便的省，市，区/县三级联动

分享js链接

链接：https://pan.baidu.com/s/1H-8_UK6rV2tOqBmKcixglQ
提取码：wni0

然后，界面引入该js

简单方便的省，市，区/县三级联动

然后html代码：

<tr style="height:25px;">
   <td class="r">户籍所在(省)</td>
                                           <td></td>
                                           <td>
                                           <select class="select" id="s_dprovince" name="s_dprovince" style="width:100%;">
                                           <option value="">--请选择省--</option>
                                               </select>
                                           </td>
                                           <td class="r">户籍所在(市)</td>
                                           <td></td>
                                           <td>
                                               <select class="select" id="s_dcity" name="s_dcity" style="width:100%;">
                                           <option value="">--请选择市--</option>
                                               </select>
                                           </td>
                                           <td class="r">户籍所在(县)</td>
                                           <td></td>
                                           <td>
                                               <select class="select" id="s_dcounty" name="s_dcounty" style="width:100%;" οnchange="getTown();">
                                           <option value="">--请选择区县--</option>
                                               </select>
                                           </td>

简单方便的省，市，区/县三级联动

js代码：

界面初始化时候先调用：

window.οnlοad=function(){
setup();//加载三级联动
}

//这个函数是必须的，因为在area.js里每次更改地址时会调用此函数
function promptinfo(){
var address = document.getElementById('address');
var s1 = document.getElementById('s_dprovince');
var s2 = document.getElementById('s_dcity');
var town1 = document.getElementById('town1');
if(s1.value!="请选择省" && s2.value=='请选择市'){//若只选择了第一项，则地址就为某某省
address.value = s1.value;
}
if(s1.value!="请选择省" && s2.value!='请选择市'){//若只选择了前两项省和市，则地址就只显示"省|市"
address.value = s1.value+"|"+s2.value;
}
if(s1.value=="请选择省"){//若什么都不选，则隐藏域地址为空串
address.value="";
}
}
//获取区县的值（若不写这个触发函数，一直获取不到第三项区县的值，一直是默认值“请选择区县”）
function getTown(){
var address = document.getElementById('address');
var s1 = document.getElementById('s_dprovince').value
var s2 = document.getElementById('s_dcity').value;
var s3 = document.getElementById('s_dcounty').value;
var town1 = document.getElementById('town1').value;
town1 = s3;
if(town1=="请选择区县"){
address.value = s1+"|"+s2;
}else{
address.value = s1+"|"+s2+"|"+town1;
}
}

</script>

效果图为：

简单方便的省，市，区/县三级联动