js实现下拉框三级级联

时间:2022-11-21 18:05:31
 <script type="text/javascript">        var citys=new Array(47);        citys[0]="北京市|海淀区";        citys[1]="北京市|朝阳区";        citys[2]="北京市|东城区";        citys[3]="北京市|西城区";        citys[4]="北京市|丰台区";        citys[5]="北京市|昌平区";        citys[6]="北京市|宣武区";        citys[7]="北京市|崇文区";        citys[8]="北京市|石景山区";        citys[9]="北京市|门头沟区";        citys[10]="北京市|通州区";        citys[11]="北京市|顺义区";        citys[12]="北京市|大兴区";        citys[13]="北京市|房山区";        citys[14]="北京市|怀柔区";        citys[15]="北京市|平谷区";        citys[16]="北京市|密云县";        citys[17]="北京市|延庆县";        citys[18]="湖南省|长沙市";        citys[19]="湖南省|浏阳市";        citys[20]="湖南省|株洲市";        citys[21]="湖南省|衡阳市";        citys[22]="湖南省|湘潭市";        citys[23]="湖南省|醴陵市";        citys[24]="湖南省|湘乡市";        citys[25]="湖南省|韶山市";        citys[26]="湖南省|耒阳市";        citys[27]="湖南省|常宁市";        citys[28]="湖南省|邵阳市";        citys[29]="湖南省|武冈市";        citys[30]="湖南省|岳阳市";        citys[31]="湖南省|临湘市";        citys[32]="湖南省|常德市";        citys[33]="湖南省|津市市";        citys[34]="湖南省|张家界市";        citys[35]="湖南省|益阳市";        citys[36]="湖南省|沅江市";        citys[37]="湖南省|郴州市";        citys[38]="湖南省|资兴市";        citys[39]="湖南省|永州市";        citys[40]="湖南省|怀化市";        citys[41]="湖南省|洪江市";        citys[42]="湖南省|娄底市";        citys[43]="湖南省|冷水江市";        citys[44]="湖南省|吉首市";        citys[45]="湖南省|浏阳市";        citys[46]="湖南省|浏阳市";                var countys=new Array(106);        countys[0]="湖南省|长沙市|岳麓区";        countys[1]="湖南省|长沙市|芙蓉区";        countys[2]="湖南省|长沙市|天心区";        countys[3]="湖南省|长沙市|开福区";        countys[4]="湖南省|长沙市|雨花区";        countys[5]="湖南省|浏阳市|长沙县";        countys[6]="湖南省|浏阳市|望城县";        countys[7]="湖南省|浏阳市|宁乡县";        countys[8]="湖南省|株洲市|天元区";        countys[9]="湖南省|株洲市|荷塘区";        countys[10]="湖南省|株洲市|芦淞区";        countys[11]="湖南省|株洲市|石峰区";        countys[12]="湖南省|衡阳市|雁峰区";        countys[13]="湖南省|衡阳市|珠晖区";        countys[14]="湖南省|衡阳市|石鼓区";        countys[15]="湖南省|衡阳市|蒸湘区";        countys[16]="湖南省|衡阳市|南岳区";        countys[17]="湖南省|衡阳市|雁峰区";  countys[18]="湖南省|衡阳市|衡阳县";  countys[19]="湖南省|衡阳市|衡东县";  countys[20]="湖南省|衡阳市|衡山县";  countys[21]="湖南省|衡阳市|衡南县";  countys[22]="湖南省|衡阳市|祁东县";  countys[23]="湖南省|醴陵市|株洲县";  countys[24]="湖南省|醴陵市|炎陵县";  countys[25]="湖南省|醴陵市|茶陵县";  countys[26]="湖南省|醴陵市|攸 县";  countys[27]="湖南省|湘潭市|岳塘区";  countys[28]="湖南省|湘潭市|雨湖区";  countys[29]="湖南省|湘乡市|湘潭县";  countys[30]="湖南省|邵阳市|双清区";  countys[31]="湖南省|邵阳市|大祥区";  countys[32]="湖南省|邵阳市|北塔区";  countys[33]="湖南省|邵阳市|邵东县";  countys[34]="湖南省|邵阳市|洞口县";  countys[35]="湖南省|邵阳市|新邵县";  countys[36]="湖南省|邵阳市|绥宁县";  countys[37]="湖南省|邵阳市|新宁县";  countys[38]="湖南省|邵阳市|邵阳县";  countys[39]="湖南省|邵阳市| 隆回县";  countys[40]="湖南省|邵阳市|城步苗族自治县";  countys[41]="湖南省|岳阳市|岳阳楼区 ";  countys[42]="湖南省|岳阳市|君山区";  countys[43]="湖南省|岳阳市|云溪区";  countys[44]="湖南省|岳阳市|岳阳县";  countys[45]="湖南省|岳阳市|湘阴县";  countys[46]="湖南省|岳阳市|平江县";  countys[47]="湖南省|岳阳市|华容县";  countys[48]="湖南省|常德市|武陵区";  countys[49]="湖南省|常德市|鼎城区";  countys[50]="湖南省|常德市|澧 县";  countys[51]="湖南省|常德市|临澧县";  countys[52]="湖南省|常德市|桃源县";  countys[53]="湖南省|常德市|汉寿县";  countys[54]="湖南省|常德市|安乡县";  countys[55]="湖南省|张家界市|永定区";  countys[56]="湖南省|张家界市|武陵源区";        countys[57]="湖南省|张家界市|慈利县";  countys[58]="湖南省|张家界市|桑植县";  countys[59]="湖南省|益阳市|赫山区";  countys[60]="湖南省|益阳市|资阳区";  countys[61]="湖南省|益阳市|桃江县";  countys[62]="湖南省|益阳市|南 县";  countys[63]="湖南省|益阳市|安化县";  countys[64]="湖南省|郴州市|北湖区";  countys[65]="湖南省|郴州市|苏仙区";  countys[66]="湖南省|郴州市|宜章县";  countys[67]="湖南省|郴州市|汝城县";  countys[68]="湖南省|郴州市|安仁县";  countys[69]="湖南省|郴州市|嘉禾县";  countys[70]="湖南省|郴州市|临武县";  countys[71]="湖南省|郴州市|桂东县";  countys[72]="湖南省|郴州市|永兴县";  countys[73]="湖南省|郴州市|桂阳县";  countys[74]="湖南省|永州市|冷水滩区";  countys[75]="湖南省|永州市|零陵区";  countys[76]="湖南省|永州市|祁阳县";  countys[77]="湖南省|永州市|蓝山县";  countys[78]="湖南省|永州市|宁远县";  countys[79]="湖南省|永州市|新田县";  countys[80]="湖南省|永州市|东安县";  countys[81]="湖南省|永州市|江永县";  countys[82]="湖南省|永州市|道 县";  countys[83]="湖南省|永州市|双牌县";  countys[84]="湖南省|永州市|江华瑶族自治县";  countys[85]="湖南省|怀化市|鹤城区";  countys[86]="湖南省|怀化市|会同县";  countys[87]="湖南省|怀化市|沅陵县";  countys[88]="湖南省|怀化市|辰溪县";  countys[89]="湖南省|怀化市|溆浦县";  countys[90]="湖南省|怀化市|中方县";  countys[91]="湖南省|怀化市|新晃侗族自治县";  countys[92]="湖南省|怀化市|芷江侗族自治县";  countys[93]="湖南省|怀化市|通道侗族自治县";  countys[94]="湖南省|怀化市|靖州苗族侗族自治县";  countys[95]="湖南省|怀化市|麻阳苗族自治县";  countys[96]="湖南省|娄底市|娄星区";  countys[97]="湖南省|娄底市|新化县";  countys[98]="湖南省|娄底市|双峰县";  countys[99]="湖南省|吉首市|古丈县";  countys[100]="湖南省|吉首市|龙山县";  countys[101]="湖南省|吉首市|永顺县";  countys[102]="湖南省|吉首市|凤凰县";  countys[103]="湖南省|吉首市|泸溪县";  countys[104]="湖南省|吉首市|保靖县";  countys[105]="湖南省|吉首市|花垣县";       function provinceChange()     {      var cur_province=document.cascadeForm.province.value;      document.getElementById('city').length=0;      var j=0;      for(var i=0;i<citys.length;i++)      {       var choosepro=citys[i].split("|");              if(choosepro[0]==cur_province)       {         document.getElementById('city').options[j]=new Option(choosepro[1],choosepro[1]);         j++;       }      }     }     function cityChange()     {      var cur_city=document.cascadeForm.city.value;      document.getElementById('county').length=0;      var j=0;      for(var i=0;i<countys.length;i++)      {       var choosecity=countys[i].split("|");       if(choosecity[1]==cur_city)       {        document.getElementById('county').options[j]=new Option(choosecity[2],choosecity[2]);        j++;       }      }     }    </script>   <form action="" name="cascadeForm" >   <table border="1" cellpadding="0" cellspacing="0" align="center" width="600px">       <tr>        <td colspan="2" align="center"><strong>级联菜单</strong></td>       </tr>    <tr>     <td align="left" width="110">      请选择省:     </td>     <td>      <select name="province" onclick="javascript:provinceChange()">          <option value="北京市">北京市</option>          <option value="上海市">上海市</option>          <option value="天津市">天津市</option>          <option value="重庆市">重庆市</option>       <option value="湖南省">湖南省</option>       <option value="">湖北省</option>       <option value="">广东省</option>       <option value="">广西省</option>       <option value="">河南省</option>       <option value="">河北省</option>       <option value="">山东</option>       <option value="">山西</option>       <option value="">浙江省</option>       <option value="">江苏省</option>       <option value="">福建省</option>       <option value="">贵州省</option>       <option value="">江西省</option>       <option value="">云南省</option>       <option value="">四川省</option>       <option value="">青海省</option>       <option value="">**自治区</option>       <option value="">*</option>       <option value="">陕西省</option>       <option value="">甘肃省</option>       <option value="">宁夏回族自治区</option>       <option value="">安徽省</option>       <option value="">辽宁省</option>       <option value="">吉林省</option>       <option value="">黑龙江省</option>       <option value="">海南省</option>       <option value="">内蒙古</option>       <option value="">香港</option>       <option value="">*</option>      </select>     </td>    </tr>    <tr>     <td align="left" width="">      请选择市或区:     </td>     <td>      <select name="city" onclick="javascript:cityChange()">       <option value="">海淀区</option>       <option value="">东城区</option>       <option value="">西城区</option>       <option value="">丰台区</option>       <option value="">昌平区</option>       <option value="">崇文区</option>       <option value="">宣武区</option>       <option value="">石景山区</option>       <option value="">门头沟区</option>       <option value="">通州区</option>       <option value="">顺义区</option>       <option value="">大兴区</option>       <option value="">房山区</option>       <option value="">怀柔区</option>       <option value="">平谷区</option>       <option value="">长沙市</option>       <option value="">浏阳市</option>       <option value="">株洲市</option>       <option value="">醴陵市</option>       <option value="">湘潭市</option>       <option value="">湘乡市</option>       <option value="">衡阳市</option>       <option value="">常宁市</option>       <option value="">耒阳市</option>       <option value="">邵阳市</option>       <option value="">武岗市</option>       <option value="">岳阳市</option>       <option value="">临湘市</option>       <option value="">常德市</option>       <option value="">津市市</option>       <option value="">张家界市</option>       <option value="">益阳市</option>       <option value="">沅江市</option>       <option value="">郴州市</option>       <option value="">资兴市</option>       <option value="">永州市</option>       <option value="">怀化市</option>       <option value="">洪江市</option>       <option value="">娄底市</option>       <option value="">冷水江市</option>       <option value="">吉首市</option>             </select>     </td>    </tr>    <tr>     <td align="left">      请选择县:     </td>     <td>      <select name="county">       <option value="">密云县</option>       <option value="">延庆</option>       <option value=""></option>       <option value=""></option>       <option value=""></option>       <option value=""></option>       <option value=""></option>      </select>     </td>    </tr>   </table>   </form>