JavaScript support for area code input of the provincial and municipal two-level linkage drop-down menu _javascript Skills

Source: Internet
Author: User
Provinces and cities two-level linkage drop-down menu, increased the area code input. Multiple sets of options share a set of data.
Select the region, you can get the area code, fill in the area code automatically selected.
In the area code collection of some cities.
<span onclick= "Inti (0)" > <select name=azone id= "Azone" onchange= "this.value=this.options[" This.selectedindex].value;altcls (); inps.value=optn.options[0].value; " > <option value= "Provinces" disabled= "Disabled" > Provinces </option> </select> <select name=cls "CLS" id= Nge= "If (this.options[0].text!= ' select City ') Inps.value=this.options[this.selectedindex].value;" > <option value=0> Select Urban </option> </select> <input type= "text" id= "INPs" name= "INPs" size= "5" Val Ue= "" onkeyup= "if (this.value.length>1) inti (0); Findarea ();" > </span> <span onclick= "Inti (1)" > <select name=azone id= "azone1" onchange= "This.value=this.option" S[this.selectedindex].value;altcls (); inps.value=optn.options[0].value; " > <option value= "Provinces" disabled= "Disabled" > Provinces </option> </select> <select name=cls id= "CLS1" Onch Ange= "If (this.options[0].text!= ' select City ') Inps.value=this.options[this.selectedindex].value;" > <option value=0> Select Urban </option> </select> <input type= "text" id= "Inps1" name= "INPs" size= "5" value= "" onkeyup= "if ( this.value.length>1) Inti (1); Findarea (); " > </span> <script> var arealist={"Beijing": [["Select urban Area", "10"],["Dongcheng District", ""],["Xicheng District", "" "],[" Chongwen District "," ""],["," ""],[" Chaoyang District "," "],[", "Fengtai District", ""],["," "" "],[" Haidian District "," ""],["Mentougou," "" "],[" Fangshan "," "],[" Tongzhou District "," "],[" Shunyi District "," "],[" Yanqing County "," "],[" Changping "," "" ["Huairou County", "" "],[" Miyun "," ""],["Pinggu County", ""],["Daxing County", "" "]," Tianjin ": [[" Select urban Area "," 22 "],[" Zone of Peace "," "],[" Hedong District "," "],[" Hexi "," "],[" Nankai District "," "],[ "Hebei District", "" "],[" Hongqiao District "," "],[" Tanggu District "," "],[" Grand Port District "," "],[" Hangu District "," "],[" Dongli District "," "],[" Xiqing District "," ""],["Jinnan District", "" "],[" Beichen District "," "" "," ",", "", "" "," "22"], ["Baochi County", "" "],[" Wu Qinghen "," "],[" Ninghe County "," "],[" Jinghai County "," "" "]," Shanghai ": [[" Select urban Area "," 21 "],[" Nanshi District "," "],[" Luwan District "," ""],["Xuhui District", "" "],[", ""],[ "Jingan", ""],["Putuo", ""],["Zhabei", ""],["Hongkou", ""],["Yangpu", ""],["Minhang", "" "],[" Baoshan "," "],[" Jiading "," "],[" Pudong New Area "," "],[" Jinshan "," "], ["Songjiang", "" "],[" Chongming County "," "],[" Qingpu County "," "],[" Nanhui County "," "],[" Fengxian "," "],[" Huangpu "," ""], "Chongqing": [["Select urban Area", "23"],["Chongqing municipality", ""],["Chengkou County", ""],[ "Dazu County", "],[", "Dianjiang County", "],[" Fengdou County "," "],[" Fengjie County "," "],[" River City "," "],[" Jiangjin "," "],[""Kai", "23"],["Liangping County", ""],["Nanchuan", ""],["Pengshui County", ""],["Rongchang County", "" "],[" Shizhu County "," ""],["Tongliang County", ""],["Wushan County", "" "],[" Wuxi County "," ""], ["Wulong County", "" ""],["Xiushan Tujia ethnic Minority autonomous Region", ""],["Yongchuan", ""],["Youyang Tujia Miao Autonomous Region", "],[" Yunyang County "," "],[" Zhongxian County "," 23 "],[" Tongnan County "," ""],["," "],[" Qijiang County "," " ]], "Hong Kong": [["Select urban Area", "0852"],["Hong Kong", ""],["Kowloon", ""],[","],["", "" "", "" Macau ": [[" Select urban Area "," 0853 "],[" Macau "," "]]," Tibet ": [[Ali] , "8073"],["Qamdo", "895"],["," Lhasa "," 891 "],[" Linzhi "," 894 "],[" Qu "," 896 "],[" Shigatse "," 892 "],[" Shannan "," 893 "]]," Xinjiang ": [[" Aksu "," 997 "],[ "Alar", "997"],["Bainguo", ""],["Bortala Mongol Autonomous Prefecture", ""],["Changji Hui Autonomous Prefecture", ""],["Hami", "902"],["Hotan", "903"],["Kashi", ""],["Karamay", "990 "],[" Kizilsu Kirgiz Zizhizhou "," "],[" Shihezi "," 993 "],[" Tumshuk "," "],[" Turpan "," 995 "],[" Urumqi "," 991 "],[" Kuitun "," 992 "],[" five Homes ","],[" Isahasak "," "]]," Inner Mongolia ": [" Alxa League "," "],[" Bayannur Meng "," "],[" Baotou "," 472 "],[" Chifeng "," 476 "],[" Hohhot "," 471 "],[" Hulunbeier "," "],[" Tongliao "," 475 "],[" Wuhai "," 473 "],[" Wulanchabu "," "],[", "" ""],["," "" "],[" Ordos "," ""], "Guangxi": [["Baise", "776"],["Beihai", "779"],["Chongzuo", "771"] , ["Fangchenggang", "770"],["Guilin", "773"],["," Guigang "," 775 "],[" Hechi "," 778 "],[" Hezhou "," "],[" Guest "," 772 "],[" Liuzhou "," 772 "],[" Nanning "," 771 "],[" Qinzhou "," 777 "], ["Wuzhou", "774"],["Yulin", "775"]], "Ningxia": ["Guyuan", "954"],["Shizuishan", "952"],["Wuzhong", "953"],["Yinchuan", "951"]], "Shanxi": [["Changzhi", "355"],[" Datong "," 352 "],[" Jincheng "," 356 "],[", ""],["Linfen", "357"],["Luliang", "],[" Shuozhou "," 349 "],[" Taiyuan "," 351 "],[" Xinzhou "," 350 "],[" Yangquan "," 353 "],[ "Yuncheng", "359"]], "Henan": [["Anyang", "372"],["Hebi", "392"],["Jiyuan", "391"],["Jiaozuo", "391"],["Luoyang", "379"],["Nanyang", "377"],["Kaifeng", "378"], ["Pingdingshan", "375"],["Sanmenxia", "398"],["Shangqiu," 370 "],[" Xinyang "," 376 "],[" Xinxiang "," 373 "],[" Xuchang "," 374 "],[" Zhengzhou "," 371 "],[" Zhoukou "," 394 "],[" Zhumadian "," 396 "],[" Luohe "," 395 "],[" Puyang "," 393 "]]," Hebei ": [[" Baoding "," 312 "],[" Cangzhou "," 317 "],[" Handan "," 310 "],[" Chengde "," 314 "],[" Hengshui "," 318 "], ["Qinhuangdao", "335"],["Langfang", "316"],["Shijiazhuang", "311"],["Tangshan", "315"],["Xingtai", "319"],["Zhangjiakou", "313"]], "Jiangxi": [["Fuzhou", "794"],["gan", ""] , ["Ji ' an", "796"],["Jingdezhen", "798"],["Jiujiang," 792 "],[" Nanchang "," 791 "],[" Shangrao "," 793 "],[" Pingxiang "," 799 "],[" Xinyu "," 790 "],[" Yichun "," 795 "],[" Yingtan " "," 701 "]]," Hunan ": [[" Changde "," "],[" Changsha "," "],[" Chenzhou "," "],[" Hengyang "," "],[" Huaihua "," "],[" Loudi "," "],[" Shaoyang "," "],[" Xiangtan "," "],[" Xiangxi Tujia ", "" "],[" Yiyang "," "],[" Yongzhou "," "],[" Yueyang "," "],[" Zhangjiajie "," "],[" "Zhuzhou", "" "]," Jiangsu ": [[" Changzhou "," 519 "],[" Lianyungang "," 518 "],[" Huai "," 517 "],[" Nanjing ","25 "],[" Nantong "," 513 "],[" Suzhou, "512"],["Suqian", "527"],["Taizhou", "523"],["Wuxi", "510"],["Xuzhou", "516"],["Yancheng", "515"],["Yangzhou", "514"],[ "Zhenjiang", "511"]], "Zhejiang": [["Hangzhou", "571"],["Huzhou", "572"],["Jiaxing", "573"],["Jinhua", "579"],["Lishui", "578"],["Ningbo", "574"],["Shaoxing", "575"], ["Taizhou", "576"],["Wenzhou", "577"],["Zhoushan," 580 "],[" Quzhou "," 570 "]]," Anhui ": [[" Anqing "," 556 "],[" Bengbu "," 552 "],[" Chaohu "," 565 "],[" Chizhou "," "],[" Chuzhou "," 550 "],[" Fuyang "," 558 "],[", "Hefei", "551"],["Huaibei", "561"],["Huainan", "554"],["Huangshan", "559"],["Liu'an", "564"],["Ma On Shan", "555"],["Suzhou", " 557 "],[" Tongling "," 562 "],[" Wuhu "," 553 "],[" Xuancheng "," "],[" Bozhou "," 558 "]", "Hubei": [["Ezhou", "711"],["Enshi", ""],["Huanggang", "713"],["Yellowstone "," 714 "],[" Jingmen "," 727 "],[" Jingzhou "," "],[" Shennongjia "," "],[" Qianjiang "," 728 "],[" Shiyan "," 719 "],[" Suizhou "," 722 "],[" Tianmen "," 728 "],[" Wuhan "," 27 "],[ "Xianning", "715"],["Xiantao", ""],["Xiangfan," 710 "],[" Xiaogan "," 712 "],[" Yichang "," 717 "]]," Heilongjiang ": [[" Daqing "," 459 "],[" daxinganling "," "],[" Harbin "," 451 "],[" Hegang "," 454 "],[" Heihe "," 456 "],[", "Jixi", "453"],["Jiamusi", "454"],["Mudanjiang", "453"],["Qitaihe", "453"],["Qiqihar", "452"],["Shuangyashan", "454"],[" Suihua "," "],[" Yichun "," 458 "]]," Jilin ": [[" Baicheng "," 436 "],[" Bss "," "],[" Changchun "," 431 "],[" Jilin "," 431 "],[" Liaoyuan "," 437 "],[" Siping "," 434 "],[" Songyuan ","438"],["Tonghua", "435"],["," "" "", "" Liaoning ": [[" Anshan "," 555 "],[" Benxi "," 414 "],[" Chaoyang "," 421 "],[" Dalian "," 456 "],[" Dandong "," 415 "],[" Fushun "," 413 "],[" Fuxin "," 418 "],[" Huludao, "429"],["Jinzhou", "416"],["Liaoyang", "419"],["Panjin", "427"],["Shenyang", "24"],["Tieling", "410"],["Yingkou", " 417 "]]," Shaanxi ": [[" Ankang, "] 915"],["Baoji", "917"],["Hanzhong", "916"],["Shangluo", ""],["Tongchuan", "919"],["Xi ' an", "29"],["Weinan", "913"],["Xianyang", "910 "],[", "Yan ' an", "911"],["Yulin", "912"]], "Gansu": [["Silver", "943"],["Dingxi", "932"],["Gannan Tibetan Autonomous Region", ""],["Jiayuguan", "937"],["Jinchang", "935"],["Jiuquan", "937"],["Lanzhou", "931"],["Linxia Hui Autonomous Region", ""],["," "],[" Pingliang "," 943 "],[" Qingyang "," 9441 "],[" Tianshui "," 938 "],[" Wuwei "," "],[" Zhangye "," 936 "]]," Qinghai ": [[Golog Tibetan Autonomous Prefecture]," "],[" Haibei Tibetan Autonomous Prefecture "," "],[" Haidong "," "],[" Hainan Tibetan Autonomous Prefecture "," "],[" sea Simon Haixi Tibetan Autonomous Prefecture "," "],[" Huangnan Tibetan Autonomous Prefecture "," "],[" Xining "," 971 "],[" Yushu Tibetan Autonomous Prefecture "," "]]," Yunnan ": [[" Baoshan "," 875 "],[" Chuxiongzhou "," ""],["Dali Bai", ""],["Dehong Dai and Jingpo Autonomous Prefecture", ""],["Autonomous Prefecture", ""],["Honghe", ""],["Kunming", "871"],["Lijiang", "888"],["Lincang", "883"],["Nujiang Lisu Autonomous Prefecture", ""],["Qujing", "874"],["Simao", "879"],["Wenshan", "],[" Xishuangbanna Dai Autonomous Prefecture "," "],[" Yuxi "," 877 "],[" zhaotong "," 870 "]]," Guizhou ": [[" Anshun "," 853 "],[" Bijie "," 857 "],[" Guiyang "," 851 "],[" Liupanshui "," 858 "],[" The Miao and Dong Autonomous Prefecture of southeast Guizhou "," ""],["Qiannan Buyei and Miao Autonomous Prefecture", ""],["Tongren", "856"],["," Zunyi "," 852 "],[" the Buyei and Miao Autonomous Prefecture of southwest Guizhou "," ""], "Sichuan": [["Aba Tibetan and Qiang Autonomous Prefecture", ""],["Bazhong", "8279"],["Deyang", " 838 "],[", "Chengdu", "28"],["Dazhou", ""],["Tibetan Autonomous Prefecture", ""],["Guang ' an", "826"],["Guangyuan", "839"],["Leshan", "833"],["Liangshan Yi Autonomous Prefecture", ""],["Meishan", "833"], ["Mianyang", "816"],["Nanchong", "817"],["" Neijiang "," 832 "],[" Panzhihua "," 812 "],[" Suining "," 825 "],[" Yaan "," 835 "],[" Yibin "," 831 "],[" Ziyang "," 832 "],[" Zigong " , "813"],["Luzhou", "830"]], "Fujian": ["Fuzhou", "591"],["Longyan", "597"],["Nanping", "599"],["Ningde", "593"],["Putian", "594"],["Quanzhou", "595"],["Sanming" "," 598 "],[" Zhangzhou "," 596 "],[" Xiamen "," 592 "]]," Shandong ": [[" Binzhou "," 543 "],[" Dezhou "," 534 "],[" Dongying "," 546 "],[" Heze "," 530 "],[" Jinan "," 531 "],[" Jining "," 537 "],[" Laiwu "," 634 "],[" Liaocheng, "635"],["Linyi", "539"],["Qingdao", "532"],["Sunshine", "633"],["Taian", "538"],["Weihai", "631"],["Weifang", " 536 "],[", "Yantai", "535"],["Zaozhuang", "632"],["Zibo," 533 "]]," Guangdong ": [[" Chaozhou "," 768 "],[" Dongguan "," 769 "],[" Foshan "," 757 "],[" Guangzhou "," 20 "],[" Heyuan "," 762 "],[" Jiangmen, "750"],["Jieyang", "663"],["," Huizhou "," 752 "],[" Maoming "," 668 "],[" Meizhou "," 753 "],[" Qingyuan "," 763 "],[" Shantou "," 754 "],[" Shanwei "," 660 "], ["Shaoguan", "751"],["Shenzhen", "755"],["," Yangjiang "," 662 "],[" Yunfu "," 766 "],[" Zhanjiang "," 759 "],[" Zhaoqing "," 758 "],[" Zhongshan "," 760 "],[" Zhuhai "," 756 "]," Hainan ": [["Baisha County", "" "],[" Baoting County "," "],[" Li "," "],[" Chengmai County "," "],[" Dingan County "," "],[" Haikou "," 898 "],[" Oriental "," 890 "],[" Li Autonomous "," "],[ "Lingao County", ""],["Lingshuix County", ""],["Qionghai", "898"],["Qiongzhongzzx County", ""],["Sanya", "899"],["Tunchang", ""],["Wanning", "898"],["Wenchang", "898"],["Wuzhi Mountain" "," "],[" Zhanzhou "," 890 "]]," Taiwan ": [[" Taipei City, "]"],["," Kaohsiung ","],["Tainan", ""],["Taizhong", ""],["Keelung", "" "],[" Hsinchu "," "" "]," Overseas Chinese ": [[" Chinese in North America, ""] , ["Chinese in South America", ""],["Australian Chinese", ""],["Asian Chinese", ""],["," European Chinese ","],["," African Chinese "," ""], "foreign guests": [["North American foreign Guests," "" "],[", "" "],[", ""],[" Asian foreign guests "," ""],["European foreign guests", ""],["African foreign guests", ""]], "other": [[Other], "00"]]}; var sk=0; var fd=0; var SKK; var ix=0; var sx=0; var Sf=document.getelementbyid ("Azone"); var Optn=document.getelementbyid ("CLS"); var Inps=document.getelementbyid (' INPs '); function Inti (n) {sk=0; Fd=0; if (n==0) {Sf=document.getelementbyid ("Azone"); Optn=document.getelementbyid ("CLS"); Inps=document.getelementbyid (' INPs '); sx=12;ix=14; } if (n==1) {Sf=document.getelementbyid ("azone1"); Optn=document.getelementbyid ("Cls1"); Inps=document.getelementbyid (' Inps1 '); Sx=9;ix=4; } if (sf.options.length<2) {for (name in arealist) {sf.options[sk++]=new Option (name,name); } return true; } window.onload=function () {for (nx=0;nx<2;nx++) {Inti (NX); SF.SELECTEDINDEX=SX; Sf.value=sf.options[sf.selectedindex].value; Altcls (); Optn.selectedindex=ix; Optn.value=optn.options[optn.selectedindex].value; Inps.value=optn.options[optn.selectedindex].value; } function Altcls () {var tmpcls=arealist[sf.value]; var fs=0; Optn.innerhtml= '; if (sf.value== "province") {optn.options[0]=new option ("← Select Left", 0); }else{try{if (Tmpcls[0][0].indexof ("select Town")!=-1) fs++; catch (e) {} optn.options[0]=new Option ("Selection area", 0); optn.options[0].disabled= "Disabled"; optn.options[0].style.color= "#060"; for (i=0;i<tmpcls.length;i++) {if (typeof (Tmpcls[i][0))!= "undefined" &&tmpcls[i][0].length>1) { Optn.options[i]=new Option (tmpcls[i][0], "0" +tmpcls[i][1]); if ("0" +tmpcls[i][1]==inps.value) {optn.selectedindex=i;fd=1;if (++FS) ==2) {Optn.selectedinDex=0;fs=1}} }else{optn.options[i]=new Option (Tmpcls[i],tmpcls[i]); }} return; function Findarea () {sk=0; if (inps.value.substring (0,1) >0) inps.value= "0" +inps.value; for (name in arealist) {sf.options[sk++]=new Option (name,name); Sf.value=sf.options[sk-1].value; Altcls (); if (fd==1) {fd=0;sf.selectedindex=sk-1;break;} }} </script>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.