<html>
<head>
<title>省市级联</title>
</head>
<body>
<script language="javascript">
/*
实现省市级联效果
*/
var provinces={
四川省:["成都市",
"自贡市",
"攀枝花市",
"泸州市",
"德阳市",
"绵阳市",
"广元市",
"遂宁市",
"内江市",
"乐山市",
"南充市",
"眉山市",
"宜宾市",
"广安市",
"达州市",
"雅安市",
"巴中市",
"资阳市",
"阿坝藏族羌族自治州",
"甘孜藏族自治州",
"凉山彝族自治州"],
山西省:["太原市",
"大同市",
"阳泉市",
"长治市",
"晋城市",
"朔州市",
"晋中市",
"运城市",
"忻州市",
"临汾市",
"吕梁市"],
内蒙古:["呼和浩特市",
"包头市",
"乌海市",
"赤峰市",
"通辽市",
"鄂尔多斯市",
"呼伦贝尔市",
"巴彦淖尔市",
"乌兰察布市",
"兴安盟",
"锡林郭勒盟",
"阿拉善盟"],
辽宁省:["沈阳市",
"大连市",
"鞍山市",
"抚顺市",
"本溪市",
"丹东市",
"锦州市",
"营口市",
"阜新市",
"辽阳市",
"盘锦市",
"铁岭市",
"朝阳市",
"葫芦岛市"],
吉林省:["长春市",
"吉林市",
"四平市",
"辽源市",
"通化市",
"白山市",
"松原市",
"白城市",
"延边朝鲜族自治州"],
黑龙江省:["哈尔滨市",
"齐齐哈尔市",
"鸡西市",
"鹤岗市",
"双鸭山市",
"大庆市",
"伊春市",
"佳木斯市",
"七台河市",
"牡丹江市",
"黑河市",
"绥化市",
"大兴安岭地区"],
上海:["上海"],
江苏省:["南京市",
"无锡市",
"徐州市",
"常州市",
"苏州市",
"南通市",
"连云港市",
"淮安市",
"盐城市",
"扬州市",
"镇江市",
"泰州市",
"宿迁市"],
浙江省:["杭州市",
"宁波市",
"温州市",
"嘉兴市",
"湖州市",
"绍兴市",
"金华市",
"衢州市",
"舟山市",
"台州市",
"丽水市"],
安徽省:["合肥市",
"芜湖市",
"蚌埠市",
"淮南市",
"马鞍山市",
"淮北市",
"铜陵市",
"安庆市",
"黄山市",
"滁州市",
"阜阳市",
"宿州市",
"巢湖市",
"六安市",
"亳州市",
"池州市",
"宣城市"],
福建省:["福州市",
"厦门市",
"莆田市",
"三明市",
"泉州市",
"漳州市",
"南平市",
"龙岩市",
"宁德市"],
江西省:["南昌市",
"景德镇市",
"萍乡市",
"九江市",
"新余市",
"鹰潭市",
"赣州市",
"吉安市",
"宜春市",
"抚州市",
"上饶市"],
山东省:["济南市",
"青岛市",
"淄博市",
"枣庄市",
"东营市",
"烟台市",
"潍坊市",
"济宁市",
"泰安市",
"威海市",
"日照市",
"莱芜市",
"临沂市",
"德州市",
"聊城市",
"滨州市",
"菏泽市"],
河南省:["郑州市",
"开封市",
"洛阳市",
"平顶山市",
"安阳市",
"鹤壁市",
"新乡市",
"焦作市",
"濮阳市",
"许昌市",
"漯河市",
"三门峡市",
"南阳市",
"商丘市",
"信阳市",
"周口市",
"驻马店市"],
湖北省:["武汉市",
"黄石市",
"十堰市",
"宜昌市",
"襄樊市",
"鄂州市",
"荆门市",
"孝感市",
"荆州市",
"黄冈市",
"咸宁市",
"随州市",
"恩施土家族苗族自治州"],
湖南省:["长沙市",
"株洲市",
"湘潭市",
"衡阳市",
"邵阳市",
"岳阳市",
"常德市",
"张家界市",
"益阳市",
"郴州市",
"永州市",
"怀化市",
"娄底市",
"湘西土家族苗族自治州"],
广东省:["广州市",
"韶关市",
"深圳市",
"珠海市",
"汕头市",
"佛山市",
"江门市",
"湛江市",
"茂名市",
"肇庆市",
"惠州市",
"梅州市",
"汕尾市",
"河源市",
"阳江市",
"清远市",
"东莞市",
"中山市",
"潮州市",
"揭阳市",
"云浮市"],
广西省:["南宁市",
"柳州市",
"桂林市",
"梧州市",
"北海市",
"防城港市",
"钦州市",
"贵港市",
"玉林市",
"百色市",
"贺州市",
"河池市",
"来宾市",
"崇左市"],
海南省:["海口市",
"三亚市"],
重庆市:["重庆"],
贵州省:["贵阳市",
"六盘水市",
"遵义市",
"安顺市",
"铜仁地区",
"黔西南布依族苗族自治州",
"毕节地区",
"黔东南苗族侗族自治州",
"黔南布依族苗族自治州"],
云南省:["昆明市",
"曲靖市",
"玉溪市",
"保山市",
"昭通市",
"丽江市",
"思茅市",
"临沧市",
"楚雄彝族自治州",
"红河哈尼族彝族自治州",
"文山壮族苗族自治州",
"西双版纳傣族自治州",
"大理白族自治州",
"德宏傣族景颇族自治州",
"怒江傈僳族自治州",
"迪庆藏族自治州"],
西藏自治区:["拉萨市",
"昌都地区",
"山南地区",
"日喀则地区",
"那曲地区",
"阿里地区",
"林芝地区"],
陕西省:["西安市",
"铜川市",
"宝鸡市",
"咸阳市",
"渭南市",
"延安市",
"汉中市",
"榆林市",
"安康市",
"商洛市"],
甘肃省:["兰州市",
"嘉峪关市",
"金昌市",
"白银市",
"天水市",
"武威市",
"张掖市",
"平凉市",
"酒泉市",
"庆阳市",
"定西市",
"陇南市",
"临夏回族自治州",
"甘南藏族自治州"],
青海省:["西宁市",
"海东地区",
"海北藏族自治州",
"黄南藏族自治州",
"海南藏族自治州",
"果洛藏族自治州",
"玉树藏族自治州",
"海西蒙古族藏族自治州"],
宁夏自治区:["银川市",
"石嘴山市",
"吴忠市",
"固原市",
"中卫市"],
新疆自治区:["乌鲁木齐市",
"克拉玛依市",
"吐鲁番地区",
"哈密地区",
"昌吉回族自治州",
"博尔塔拉蒙古自治州",
"巴音郭楞蒙古自治州",
"阿克苏地区",
"克孜勒苏柯尔克孜自治州",
"喀什地区",
"和田地区",
"伊犁哈萨克自治州",
"塔城地区",
"阿勒泰地区"],
台湾省:["台北市"],
香港特区:["香港"],
澳门特区:["澳门"]};
//加载省
function loadProvince()
{
//获取省所对应的列表框对象
var pro=document.getElementById("province");
//从数组中提取省份信息
for(var p in provinces)
{
//创建option元素
var opt=document.createElement("option");
//设置option元素中的信息
opt.innerText=p;
opt.value=p;
//将option元素添加到select元素中(option是select的子节点)
pro.appendChild(opt);
}
}
//加载市
function loadCity()
{
//获取用户的省份
var selectProvince=document.getElementById("province").value;
//根据省获取市(citys是一个数组)
var citys=provinces[selectProvince];
//获取市所对应的列表框对象
var city=document.getElementById("city");
//将元素列表框中的元素全部清空
city.innerText="";
var opt=document.createElement("option");
opt.innerText="--请选择城市--";
opt.value="0";
city.appendChild(opt);
for(var index=0;index<citys.length;index++)
{
opt=document.createElement("option");
opt.innerText=citys[index];
opt.value=citys[index];
city.appendChild(opt);
}
}
//在窗口加载时添加省份信息
window.onload=loadProvince;
</script>
<select id="province" onchange="loadCity();">
<option value="0">--请选择省份--</option>
</select>
<select id="city">
<option value="0">--请选择城市--</option>
</select>
</body>
</html>
分享到：
相关推荐
在网页开发中，"Ajax 省市级联"是一种常见的交互设计，用于实现用户选择省份时，自动加载并展示对应省份的城市列表。这种方式极大地提升了用户体验，避免了页面刷新，使得数据加载更为流畅。Ajax（Asynchronous ...
"HTML中JavaScript版省市级联"是一个常见的前端技术应用，用于实现动态的省市区选择功能。在这个场景下，用户可以从一个下拉菜单中选择省份，然后根据所选省份自动更新市、区的下拉选项。这种功能在注册、地址填写等...
【安卓 Spinner 实现省市级联】是Android开发中常见的需求，用于在应用程序中创建一个下拉选择组件，展示省、市、区等地理层级的数据。Spinner控件在Android中广泛用于实现有限选项的选择，通常与Adapter配合使用，...
标题中的“省市级联列表”通常是指在数据库设计中用于存储中国省份和城市信息的一种数据结构，这在很多需要地域信息的应用中非常常见，比如电商、物流、招聘网站等。这种列表一般会包括省份和其下属的城市，形成一个...
在IT行业中，"省市级联完整代码"通常指的是一个用于实现中国省级和市级选择功能的程序代码，这种功能常见于各种需要用户输入地区信息的Web应用或者移动应用中。级联选择意味着当用户选择了一个省份后，下拉框会动态...
【AJAX省市级联】是一种常见的前端开发技术，用于实现网页上的动态下拉联动效果，让用户在选择省份后，自动加载并显示对应的市、区或县的列表，无需刷新整个页面。这种技术主要依赖于AJAX（Asynchronous JavaScript ...
### 省市级联实现详解 #### 一、概述 在现代Web应用开发中，级联选择器（如省市区选择）是一种常见的交互设计模式，主要用于处理多层级数据的关联选择场景。例如，在用户填写地址时，根据所选省份动态显示对应的...
在IT行业中，省市级联（Province-City-County Association，简称PCCA）是一种常见的数据结构和功能设计，特别是在地理信息系统、电子商务、政务服务等场景中，用于处理和展示多层次的地域层级关系。它允许用户在选择...
"省市级联"是一个常见的前端功能，主要用于实现用户在选择省份时，下拉菜单自动更新对应的城市选项，从而提供更加便捷的用户输入体验。这种功能在注册、地址填写等场景中非常常见。 在给定的"js省市级联"项目中，它...
"超强的jquery省市级联"是指利用jQuery实现的一种动态联动效果，通常用于网页上的地址选择，例如选择省份后自动加载对应的城市列表，城市选择后再加载对应的区县列表。这种功能在电子商务网站、地图服务、物流配送等...
使用javaScript实现省市级联（二级级联，不能三级级联）
在IT行业中，XML因其灵活性和易读性而广泛应用于各种应用场景，包括构建省市级联选择功能。在这个项目中，“XML省市级联”意味着我们使用XML文件来存储和管理省份和城市的数据，然后通过Dreamweaver这一流行的网页...
在IT行业中，省市级联（Province-City-County Association，简称PCCA）是一种常见的地理信息组织方式，尤其在Web开发中用于实现下拉选择框的联动效果，为用户提供便捷的地区选择体验。这个数据包是专门针对中国境内...
绝对给力的 省市级联demo [removed][removed] [removed][removed] [removed][removed] <style type="text/css"> #province{ width:90px; margin-left:5px} #city{ width:130px; margin-left:5px} #...
### 使用jQuery实现省市级联选择器 #### 一、引言 在许多应用程序中，我们需要让用户根据省份选择相应的城市，这种需求通常通过级联选择器来实现。传统的做法是使用纯JavaScript结合HTML来完成，但这种方法较为繁琐...
在“xml+js省市级联”这个场景中，它们被结合使用来实现一个动态的、无需页面刷新的省级和市级联动选择功能。 这种功能常见于地址输入或区域选择的场景，用户首先选择省份，然后根据所选省份动态加载对应的市，整个...
在IT行业中，省市级联（Province-City-Association，PCA）是一种常见的数据组织方式，尤其在构建具有地域选择功能的Web应用或系统时。这里，我们主要探讨的是使用Java编程语言来实现这种功能的技术细节。 首先，...
JavaScript省市级联是一种常见的前端开发技术，用于实现用户在选择省份时自动更新下拉框中的城市选项，以此类推到区县等更细的行政区域。这种功能在各种需要填写地址信息的表单中非常常见，例如在线购物、预约服务等...
在IT行业中，省市级联数据通常指的是中国行政区域划分的数据，包括省份、城市、区县乃至街道等层次的详细信息。这些数据对于地理信息系统（GIS）、数据分析、地图服务、物流配送、人口统计等多个领域都至关重要。"4...