<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<script language="javascript">
var areaArray = new Array();
areaArray[areaArray.length]=new Array("1","杭州");
areaArray[areaArray.length]=new Array("2","湖州");
areaArray[areaArray.length]=new Array("3","温州");
areaArray[areaArray.length]=new Array("4","shuozhou");
var townArray = new Array();
townArray[townArray.length]=new Array("1","1","上城区");
townArray[townArray.length]=new Array("1","2","下城区");
townArray[townArray.length]=new Array("2","3","南浔镇");
townArray[townArray.length]=new Array("2","4","菱湖镇");
townArray[townArray.length]=new Array("3","5","乐清");
townArray[townArray.length]=new Array("3","6","苍南");
townArray[townArray.length]=new Array("4","7","huairen");
townArray[townArray.length]=new Array("4","8","yingxian");
function setTown(obj1ID,obj2ID){
var objArea = document.getElementById(obj1ID);
var objTown = document.getElementById(obj2ID);
var i;
var itemArray = null;
if(objArea.value.length > 0){
itemArray = new Array();
for(i=0;i<townArray.length;i++){
if(townArray[i][0]==objArea.value){
itemArray[itemArray.length]=new Array(townArray[i][1],townArray[i][2]);
}
}
}
for(i = objTown.options.length ; i >= 0 ; i--){
objTown.options[i] = null;
}
objTown.options[0] = new Option("请选地区");
objTown.options[0].value = "";
if(itemArray != null){
for(i = 0 ; i < itemArray.length; i++){
objTown.options[i+1] = new Option(itemArray[i][1]);
if(itemArray[i][0] != null){
objTown.options[i].value = itemArray[i][0];
}
}
}
}
</script>
<body>
<table width="99%" border="0" align="center" style="border-bottom:1px solid #cccccc">
<tr>
<td width="10">
<select name="areaid" id="areaid" onChange="setTown('areaid','townid')">
<option value="">请选市县</option>
<option value="1">杭州</option>
<option value="2">湖州</option>
<option value="3">温州</option>
<option value="4">suozhou</option>
</select>
</td>
<td width="10">
<select name="townid" id="townid">
<option value="">请选地区</option>
</select>
</td>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
标题中的“省市连动纯Js版”指的是一个使用JavaScript实现的省市区联动选择功能的代码版本。这种功能常见于各种在线表单或者电子商务网站，允许用户在选择省份后，自动更新下拉菜单显示对应的市、区，提高用户体验。...
在JavaScript（JS）开发中，"省市区三级连动"是一种常见的交互设计，常用于地址选择、用户信息填写等场景。这种设计允许用户通过选择省份，自动加载对应的市，再选择市来加载对应的区，以此类推。这样做既提高了用户...
3. **jQuery 初始化**：在页面加载完成后，使用jQuery的`$(document).ready()`函数初始化连动效果。根据数据结构，设置初始省份下拉列表，并监听其`change`事件。 4. **事件处理**：当用户选择省份时，触发`change`...
标题提到的"extj省市区连动js分装类"，指的是使用ExtJS框架实现的一个JavaScript类，这个类专门用于处理中国省、市、区三级联动的选择效果。ExtJS是一个强大的JavaScript UI库，它提供了丰富的组件和数据绑定机制，...
本案例中，开发人员选择使用 **JavaScript (JS)** 和 **XML** 来实现省市二级联动下拉框功能。这种方式的优点是不需要服务器端的支持，只需要前端技术就可以完成，因此具有很好的灵活性和轻量性。 #### 三、XML文件...
在实际应用中，省市连动程序的工作原理通常是：当用户在省的下拉列表中选择一个省份时，通过JavaScript或者AJAX技术异步请求服务器，服务器根据选择的省份查询数据库并返回相应的城市数据，然后更新城市下拉列表。...
这个"省市连动菜单"的Javascript插件提供了一种高效、便捷的方式来实现这一功能，用户只需简单地将插件引入到项目中，就可以轻松创建出联动效果，即选择省份后，自动展示对应的市一级城市列表。 JavaScript是Web...
"iosSelect.js"是一个专为实现多级联动选择效果而设计的库，尤其适用于创建具有省市区县乡村五级分类的下拉菜单。这样的功能在地理信息系统、电子商务网站或者需要用户输入详细地址的场景中非常常见。下面我们将详细...
在给定的标签"省市连动"中，我们可以理解到菜单之间的联动关系，即选择一个省份后，相应的城市会自动更新，依次类推，直到选定区县。 以下是关于这个主题的一些详细知识点： 1. **HTML结构**： - `Untitled-1....
在本例中，我们关注的是如何通过下拉列表来实现省、市、区的联动效果，以便用户可以方便地逐级选择。 首先，我们需要理解这个功能的基本工作原理。通常，省市区连动是通过JavaScript和HTML配合实现的。在HTML部分，...
JavaScript接收到数据后动态更新DOM元素，实现联动效果。jsp可以用来展示基础的HTML结构，并嵌入JavaScript代码。 2. **jQuery+jsp+servlet实现**： jQuery是JavaScript的一个库，提供了更方便的DOM操作和AJAX请求...
3. JavaScript/jQuery部分：介绍如何实现下拉菜单的联动效果，包括选择事件的监听和动态更新下拉选项的函数。 4. 部署指南：指导如何将ASP页面和相关文件上传到服务器，以及如何在实际网站中调用这个功能。 "city...
省市三级联动JS插件，数据来源：最新县及县以上行政区划代码
该插件的核心思想是利用jQuery的事件监听和DOM操作功能，实现下拉菜单之间的联动效果。当用户在一级菜单（省份）中选择一个选项时，二级菜单（城市）会动态加载与所选省份相关的城市列表；同理，当用户在二级菜单中...
总结起来，"中国省市县三级连动json数据"是一个便于处理和展示中国行政区域信息的数据集，它采用JSON格式，结构清晰，易于解析，并且适用于各种需要三级联动效果的应用场景。理解和掌握这种数据结构对于进行与地理...
标题中的"Jason三级省市县连动"指的是在前端开发中，使用Jason（一种轻量级的数据交换格式）来实现一个动态的、具有三级结构的省市县联动选择功能。这种功能常见于地址输入、订单填写等场景，用户在选择省之后，市会...
每个记录包含省份ID、省份名称、城市ID、城市名称、区县ID及区县名称等字段，这些字段用于构建联动效果。 实现三级连动的技术方案主要包括以下几点： 1. 数据结构设计：数据需要按照一定的层级关系组织，如省级...
这项技术主要涉及到Ajax（Asynchronous JavaScript and XML）的运用，以及数据库操作，特别是处理省级、市级、区级地理位置数据的联动效果。以下是关于这个主题的详细知识点： 1. **Ajax**：Ajax是一种不刷新整个...
标题提到的“asp省市县三级连动下拉框带数据库”就是这样一个解决方案，而且据描述所述，这个例子是作者自创的，且经过验证，效果良好。 首先，我们来了解什么是三级联动。在网页设计中，三级联动通常指的是三个...
day12-liandong**：这个文件名可能是项目中的一个示例文件，可能包含具体的HTML、JavaScript（可能包括jQuery和Ajax的代码实现）、CSS，以及服务器端的PHP或Node.js脚本，用于演示如何实现省市二级联动。 6. **优化...