Shulou(Shulou.com)06/01 Report--

It is believed that many inexperienced people are at a loss about how to realize the three-level linkage of provinces, cities and regions in javascript. Therefore, this paper summarizes the causes and solutions of the problems. Through this article, I hope you can solve this problem.

Here are three select elements, as shown below:

Province: please select city: please select district / county: please select

Prepare some city-related data, this example enumerates only a small number. As follows:

Var data = {"Beijing": {"Municipal District": [Dongcheng District, Xicheng District, Chaoyang District, Fengtai District, Shijingshan District, Haidian District, Mentougou District, Fangshan District, Tongzhou District, Shunyi District, Changping District, Daxing District, Huairou District, Pinggu District, Miyun District "Yanqing District"]}, "Hebei Province": {"Shijiazhuang": ["Changan District", "Qiaoxi District", "Xinhua District", "Jingxing Mining area", "Yuhua District", "Gaocheng District", "Luquan District", "Luancheng District", "Jingxing County", "Zhengding County", "Xingtang County", "Lingshou County", "Gaoyi County", "Shenze County" "Zanhuang County", "Wuji County", "Pingshan County", "Yuanshi County", "Zhao County", "Shijiazhuang High-tech Industrial Development Zone", "Shijiazhuang Recycling Chemical Park", "Xinji City", "Jinzhou City", "Xinle City", "Tangshan City": ["Lunan District", "Lubei District", "Guye District", "Kaiping District", "Fengnan District" "Fengrun District", "Caofeidian District", "Luanxian County", "Luannan County", "Leting County", "Qianxi County", "Yutian County", "Tangshan Lutai Economic and technological Development Zone", "Tangshan Hangu Management Zone", "Tangshan High-tech Industrial Development Zone", "Hebei Tangshan Seaport Economic Development Zone", "Zunhua City", "Qian'an City"] "Qinhuangdao City": ["Haigang District", "Shanhaiguan District", "Beidaihe District", "Funing District", "Azure Dragon Manchu Autonomous County", "Changli County", "Lulong County", "Qinhuangdao Economic and technological Development Zone", "Beidaihe New area"), "Handan City": ["Hanshan District", "Congtai District", "Fuxing District", "Fengfeng Mining area" "Feixiang District", "Yongnian District", "Linzhang County", "Cheng'an County", "Daming County", "related County", "ci County", "Qiu County", "Jize County", "Guangping County", "Guantao County", "Wei County", "Quzhou County", "Handan Economic and technological Development Zone", "Handan Jinan New area", "Wu'an City"] "Hengshui City": ["Taocheng District", "Jizhou District", "Zaoqiang County", "Wuyi County", "Wuqiang County", "Raoyang County", "Anping County", "Gucheng County", "Jingxian County", "Fucheng County", "Hebei Hengshui Economic Development Zone", "Hengshui Lake New area", "Shenzhou City"]} "Hunan Province": {"Changsha City": ["Furong District", "Tianxin District", "Yuelu District", "Kaifu District", "Yuhua District", "Wangcheng District", "Changsha County", "Liuyang City", "Ningxiang City"], "Zhuzhou City": ["Hetang District", "Lusong District", "Shifeng District", "Tianyuan District", "Zhuzhou County", "you County" "Chaling County", "Yanling County", "Yunlong demonstration Zone", "Liling City", "Xiangtan City": ["Yuhu District", "Yuetang District", "Xiangtan County", "Hunan Xiangtan High-tech Industrial Park", "Xiangtan Zhaoshan demonstration Zone", "Xiangtan Jiuhua demonstration Zone", "Xiangxiang City", "Shaoshan City"], "Hengyang City": [Zhuhui District " "Yanfeng District", "Shigu District", "Fanxiang District", "Nanyue District", "Hengyang County", "Hengnan County", "Hengshan County", "Hengdong County", "Qidong County", "Hengyang Comprehensive Free Trade Zone", "Hunan Hengyang High-tech Industrial Park", "Hunan Hengyang Pine Wood Economic Development Zone", "Leiyang City", "Changning City"],} "Guangdong": {"Guangzhou": ["Liwan District", "Yuexiu District", "Haizhu District", "Tianhe District", "Baiyun District", "Huangpu District", "Panyu District", "Huadu District", "Nansha District", "Conghua District", "Zengcheng District"], "Shaoguan City": ["Wujiang District", "Hanjiang District", "Qujiang District", "Shixing County" "Renhua County", "Wengyuan County", "Ruyuan Yao Autonomous County", "Xinfeng County", "Lechang City", "Nanxiong City"], "Shenzhen City": ["Luohu District", "Futian District", "Nanshan District", "Baoan District", "Longgang District", "Yantian District", "Longhua District", "Pinshan District"), "Zhuhai City": [Xiangzhou District " "Doumen District", "Jinwan District"],}}

PS: the actual working data is generally provided by the database. You can also search on the Internet if necessary, and many great gods collect complete city data.

When these are ready, we will analyze the functions in accordance with the usual practice and complete them step by step.

1 obtain three drop-down boxes for provinces, cities and counties, as follows:

Var eProvince = document.getElementById ('province'); var. After reading the above, have you mastered the method of how to realize the three-level linkage of provinces, cities and regions in javascript? If you want to learn more skills or want to know more about it, you are welcome to follow the industry information channel, thank you for reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.