使用城市的js实现省市区的三级联动

引入获取城市的js:

<script src="~/Scripts/shop_module_city.min.js"></script>

body代码如下：

 <select name="province" id="province" onchange="set_city(this);">
                                            <option value="" selected=""></option> 
                                        </select>
                                        <select name="city" id="city" onchange="set_zone(this);">
                                            <option value="" selected=""></option>
                                        </select>
                                        <select name="zone" id="zone">
                                            <option value="" selected=""></option>
 

<script type="text/javascript">

	//获取省市区
	var province = document.getElementById("province"),
		city = document.getElementById("city"),
		zone = document.getElementById("zone");
	function set_province(){
		for(var i in region){
			province[i-1] = new Option(region[i].name,region[i].name);
		}
	}
	function set_city(obj){
		var data_region = region[obj.selectedIndex+1];
		city.length=1;
		for(var i in data_region['child']){
			city[i]=new Option(data_region['child'][i].name,data_region['child'][i].name);
		}
		set_zone(obj);
	}
	function set_zone(obj){
		var data_region = region[province.selectedIndex+1]['child'][city.selectedIndex]['child'];
		zone.length=1;
		for(var i in data_region){
			for(var j in data_region[i]){
				zone[j]=new Option(data_region[i][j].name,data_region[i][j].name);
			}
		}
	}
	 
	set_province();

	 
</script>
 

实现效果如下：

需要js的可以联系我哦！