<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script language="JavaScript" type="text/javascript">
<!--
/*
* 说明：将指定下拉列表的选项值清空
* 作者：CodeBit.cn ( http://www.CodeBit.cn )
** @param {String || Object]} selectObj 目标下拉选框的名称或对象，必须
*/
function removeOptions(selectObj)
{
if (typeof selectObj != 'object')
{
selectObj = document.getElementById(selectObj);
}
// 原有选项计数
var len = selectObj.options.length;
for (var i=0; i < len; i++)
{
// 移除当前选项
selectObj.options[0] = null;
}
}
/*
* 说明：设置传入的选项值到指定的下拉列表中
* 作者：CodeBit.cn ( http://www.CodeBit.cn )
*
* @param {String || Object]} selectObj 目标下拉选框的名称或对象，必须
* @param {Array} optionList 选项值设置 格式：[{txt:'北京', val:'010'}, {txt:'上海', val:'020'}] ，必须
* @param {String} firstOption 第一个选项值，如：“请选择”，可选，值为空
* @param {String} selected 默认选中值，可选
*/
function setSelectOption(selectObj, optionList, firstOption, selected)
{
if (typeof selectObj != 'object')
{
selectObj = document.getElementById(selectObj);
}
// 清空选项
removeOptions(selectObj);
// 选项计数
var start = 0;
// 如果需要添加第一个选项
if (firstOption)
{
selectObj.options[0] = new Option(firstOption, '');
// 选项计数从 1 开始
start ++;
}
var len = optionList.length;
for (var i=0; i < len; i++)
{
// 设置 option
selectObj.options[start] = new Option(optionList[i].txt, optionList[i].val);
// 选中项
if(selected == optionList[i].val)
{
selectObj.options[start].selected = true;
}
// 计数加 1
start ++;
}
}
//-->
</script>
<body>
<script language="JavaScript" type="text/javascript">
var cityArr = [];
cityArr['江苏省'] = [
{txt:'南京', val:'南京'},
{txt:'无锡', val:'无锡'},
{txt:'徐州', val:'徐州'},
{txt:'苏州', val:'苏州'},
{txt:'南通', val:'南通'},
{txt:'淮阴', val:'淮阴'},
{txt:'扬州', val:'扬州'},
{txt:'镇江', val:'镇江'},
{txt:'常州', val:'常州'}
];
cityArr['浙江省'] = [
{txt:'杭州', val:'杭州'},
{txt:'宁波', val:'宁波'},
{txt:'温州', val:'温州'},
{txt:'湖州', val:'湖州'}
];
function setCity(province)
{
setSelectOption('city', cityArr[province], '-请选择-');
}
</script>
<select name="province" id="province" onchange="if(this.value != '') setCity(this.options[this.selectedIndex].value);">
<option value="">-请选择-</option>
<option value="江苏省">江苏省</option>
<option value="浙江省">浙江省</option>
</select> 省
<select name="city" id="city">
<option value="">-请选择-</option>
</select> 市
</body>
</html>
分享到：
相关推荐
在JavaScript编程中，二级联动是一种常见的交互效果，通常用于实现如省市区选择、类别筛选等场景。本资源“js二级联动_精简实用版”提供了一个简洁高效的解决方案，适用于需要快速集成到项目中的开发者。 首先，...
当输出端口电流超过阈值后，SITOP Select会在一段时间后自动断开输出，保护电路不受损害。断电后，通过按下复位按钮可以重新激活输出端口。这个复位按钮同样可以用来设置开机延迟。 6. 开机延迟功能： 复位按钮不仅...
"实例省级联动 精简版" 提供了一个简洁且易于应用的解决方案，允许用户在选择省份后，下拉菜单会自动更新对应的城市选项，确保数据的实时性和准确性。 省级联动实例的核心在于动态数据加载和下拉菜单的联动效果。...
在网页开发中，有时我们需要实现一个功能，让用户在选择省份时，对应的下拉菜单自动更新为该省份的城市，再选择城市后，下拉菜单再次更新为该城市下的区县。这种交互效果通常被称为“三级联动菜单”。在这个场景下，...
在网页开发中，"jQuery模拟select下拉框三级城市联动代码"是一种常见的交互设计，用于实现用户在选择一级城市后，自动更新二级城市列表，接着选择二级城市后，再动态加载三级城市的联动效果。这种技术提高了用户体验...
在IT行业中，"省市js二级联动"是一种常见的前端交互功能，尤其在网页表单设计时，用于用户选择省市区信息。这种功能通过JavaScript实现，能够根据用户选择的省份动态加载对应的市区列表，提供了良好的用户体验。下面...
信息系统项目管理师考试必过神之冲刺背诵口诀精简黄色版（自己整理） 信息系统项目管理师考试神器，帮助了无数的人顺得地记住考点，通过考试。 信息系统项目管理师考试必过神之冲刺背诵口诀精简黄色版（自己整理）...
总结起来，"YMDClass年月日三级联动纯JS封装类精简插件"是一个高效、轻量级的日期选择解决方案，适用于那些希望在不依赖外部库的情况下提供良好用户体验的网页开发者。通过简单的配置和调用，开发者可以轻松地在他们...
本压缩包包含三个文件： ...注意的是RT 7 Lite的配置文件是我经过自己测试的出来的，在我目前理解的范围内所能进行的最大精简！绝对不是网上那些垃圾配置文件，随便改一改就赚点分，鄙视那样的人！
在当前的Web开发中，创建一个无限级折叠菜单是一个常见的需求，特别是对于那些需要以层级形式展示内容的网站来说。本次解析的案例是一个简单的JavaScript实现的无限级折叠菜单，它允许开发者通过纯JavaScript来实现...
自己动手精简我们jre，再打包成exe这样java程序就可以在windows下很好的运行了，而且jre体积也很小不影响下载！感兴趣的可以下载后动手精简一下你的jre，我的精简到了2M以内，做成exe后根本看不出来是java做的。里面...
【描述】"极度精简，需要自己下载所需驱动程序。老机子使用的福音。"这说明该XP精简版在制作过程中删除了大量的非核心组件和服务，以减少系统占用的空间，提高系统的运行效率。由于进行了大量的精简，可能不包含一些...
在使用这些文件进行系统精简时，需要了解每个文件的作用，并根据自己的实际需求谨慎操作。对于不熟悉电脑操作的用户，建议在专业人士的指导下进行，以避免误操作导致的问题。同时，精简系统后，应定期检查系统更新和...
在精简版中，VB6.0的窗体设计工具依然可用，开发者可以轻松创建各种用户界面，包括菜单、按钮、文本框、列表框等控件，通过设置控件属性和编写事件处理代码，实现交互式的应用程序。此外，VB6.0的集成开发环境（IDE...
最近在写一个小程序，jre1.8.0_181整整有199mb，对于一个只有400多k的程序来说，完全没必要，于是就进行精简，把jre精简到40M、左右，程序也能正常运行。如果你急需使用精简的jre，可以下载试试。
【标题】：“VS2010绿色精简”是指Visual Studio 2010的精简版，这种版本通常是为了方便用户快速安装和使用而设计的。与完整版相比，它去除了许多非核心功能...用户在选择时应根据自己的实际需要来决定是否使用精简版。
NTLite是一款强大的Windows定制工具，允许用户在安装前精简操作系统，删除不必要的组件，从而减少硬盘占用，提高系统运行效率。通过NTLite，用户可以自定义安装设置，如语言、驱动程序、服务、更新、甚至集成额外的...
- **兼容性**：精简版JRE可能会导致一些依赖于完整JRE功能的第三方库无法正常工作，因此在部署前需要确保所有依赖都能在精简版上运行。 - **更新维护**：由于精简版JRE可能没有官方更新，因此需要自行关注安全漏洞并...
自己做的mysql精简版，已含maridb，4个版本才10M。平均每个版本不足3M,还包含最新版maridb的精简版，包括日志查看器，内附自己编写的mysql管理器，可以实现非常多的管理功能，虽然是批处理，但是很绿色，解压即可...