<html>
<head>
<title> new document </title>
<script language="javascript">
function createProvince(){
//所有省份的数组
var provinces = ['--请选择省份--','北京市', '福建省', '湖北省'];
//获取文档中省份这个列表框元素对象
var province=document.myform.province;
for(var i = 0; i < provinces.length; i++){
//往省份的选项组中添加选项
province.options.add(new Option(provinces[i], provinces[i]));
}
}
function createcity(){
var citylist = new Array();
citylist['--请选择省份--'] = ['--请选择城市--'];
citylist['北京市'] = ['东城区', '西城区', '海淀区', '朝阳区', '大兴区', '昌平区', '怀柔'];
citylist['福建省'] = ['福州市', '厦门市', '泉州市', '龙岩市', '三明市'];
citylist['湖北省'] = ['武汉', '宜昌', '襄樊', '黄石', '黄冈', '十堰'];
//获得选中的省份值
var selectedProv=document.myform.province.value;
var cityOption;
//清空城市列表框中原来的所有选项
document.myform.city.options.length=0;
//添加对应省份的所有城市
for (var city = 0; city < citylist[selectedProv].length; city++) {
//构造选项
cityOption = new Option(citylist[selectedProv][city], citylist[selectedProv][city]);
document.myform.city.options.add(cityOption);
}
}
</script>
</head>
<body onload="createProvince()">
<form name="myform" >
<select name="province" id="province" onchange="createcity()">
</select>
<select name="city" id="city">
<option>--请选择城市--</option>
</select>
</form>
</body>
</html>
分享到：
相关推荐
javascript实现省市级联菜单的效果
在IT行业中，省市级联菜单是一种常见的用户界面元素，尤其在网页或应用程序中，用于让用户选择省份和城市。这种交互方式能够有效地节省空间并...通过不断地学习和实践，开发者可以创建出更加智能、用户友好的级联菜单。
级联菜单插件是一种常用的网页交互元素，常用于在网页中实现下拉式的多级选择功能，例如在省市区选择、分类导航等场景。在给定的标题和描述中，我们可以看到这种插件主要与jQuery库相关，因此我们将重点探讨jQuery...
**很好用的js省市级联菜单** 在网页开发中，级联菜单（Cascading Dropdown Menu）是一种常见的交互设计元素，常用于展示层次结构的数据，如中国的省市区选择。JavaScript作为客户端脚本语言，能够轻松实现动态交互...
这种技术常用于构建如省市级联菜单，让用户在选择时无需等待页面刷新，提高网站交互性和效率。 无刷新，即Ajax（Asynchronous JavaScript and XML）技术，它允许网页在不重新加载整个页面的情况下与服务器交换数据...
"HTML中JavaScript版省市级联"是一个常见的前端技术应用，用于实现动态的省市区选择功能。在这个场景下，用户可以从一个下拉菜单中选择省份，然后根据所选省份自动更新市、区的下拉选项。这种功能在注册、地址填写等...
省市联动级联菜单是一种常见的前端交互设计，常用于地址选择、地区筛选等场景。这个功能主要是通过JavaScript实现的，不需要数据库支持，所有的省份和城市数据都存储在JS文件中。这种方式简化了系统的复杂性，降低了...
在网页开发中，省市级联下拉菜单是一种常见的交互元素，用于用户选择所在省份和城市。这种菜单的设计目的是节省页面空间并提供清晰的导航。在本案例中，我们主要讨论如何使用JavaScript实现这样的功能。 首先，我们...
根据给定的信息，我们可以推断出这是一段与创建级联菜单相关的代码示例，主要涉及的是国家（这里为美国）及其下辖各州和部分城市的层级关系数据组织方式。下面将详细介绍这段代码中所涉及的关键知识点。 ### 1. ...
在网页设计中，省市级联三级菜单是一种常见的交互效果，用于展示地区层级关系，例如中国的省级、市级和县级。这种菜单通常应用于用户填写地址、选择配送区域或进行其他地域相关操作时，使得用户能快速、准确地定位到...
在级联菜单中，用户首先选择省份，接着展开对应的市级菜单，最后再选择具体的县级区域，从而实现快速定位。 构建这样的级联菜单通常涉及以下技术点： 1. **HTML 结构**：HTML 是网页的基础，级联菜单的框架由`<ul>...
总的来说，这个“省市级联代码纯Javascript”资源提供了一种无服务器依赖的级联效果实现，开发者可以通过学习和应用这个代码，提升自己的JavaScript技能，同时也能优化Web应用的性能和用户体验。通过深入理解这些...
全国省市级联下拉菜单 <script src="test2.js" defer></script> 选择省份： (this)"> <!-- 省份数据将动态插入这里 --> 选择城市： <!-- 城市数据将根据省份选择动态插入这里 --> ``` JavaScript...
"省市级联"是一个常见的前端功能，主要用于实现用户在选择省份时，下拉菜单自动更新对应的城市选项，从而提供更加便捷的用户输入体验。这种功能在注册、地址填写等场景中非常常见。 在给定的"js省市级联"项目中，它...
在IT行业中，XML因其灵活性和易读性而广泛应用于各种应用场景，包括构建省市级联选择功能。在这个项目中，“XML省市级联”意味着我们使用XML文件来存储和管理省份和城市的数据，然后通过Dreamweaver这一流行的网页...
【经典Ajax省市级联菜单】是一个利用Ajax技术实现的交互式菜单系统，它通过与后台服务器的异步通信，实现了省市区数据的动态加载。在这个系统中，用户选择省份时，Ajax会向服务器发送请求，服务器响应后返回对应省份...
标题 "全国省市级联下拉菜单" 暗示了这是一个网页开发相关的项目，它涉及到在没有使用数据库的情况下，创建一个动态的、无刷新的中国省市联动选择菜单。这种功能通常用于用户输入地址或者选择地理位置时，提供方便的...
在本文中，我们将深入探讨如何使用Django框架实现省市县级联菜单。Django是一个功能强大的Python Web开发框架，以其高效、简洁和可扩展性而受到广泛赞誉。在Web应用程序中，级联下拉菜单通常用于表示地理位置信息，...
在省市级联的场景下，jQuery可以用来动态加载和展示下拉菜单，实现用户选择某一省级行政区后，自动加载对应的市级行政区，再进一步加载区县级行政区的联动效果。 为了实现这样的功能，开发者可能需要编写以下步骤的...
标题中的“通用省市级联菜单”指的是一个软件或网页开发中的功能模块，它通常用于用户在选择地址时提供逐级下拉的选择体验，比如选择国家、省份、城市等。这种菜单设计可以方便用户快速准确地定位到自己的位置，同时...