html两个下拉列表省市关联，基于javascript实现全国省市⼆级
联动下拉选择菜单
本⽂实例讲述了js实现全国省市⼆级联动下拉选择菜单，分享给⼤家供⼤家参考。具体如下：
效果图：
具体代码：
⽆标题⽂档
//好像不是这样⼦
var arr_province = ["请选择省/城市","北京市","上海市","天津市","重庆市","深圳市","⼴东省","河南省"];
var arr_city = [
["请选择城市/地区"],
["东城区","西城区","朝阳区","宣武区","昌平区","⼤兴区","丰台区","海淀区"],
['宝⼭区','长宁区','丰贤区', '虹⼝区','黄浦区','青浦区','南汇区','徐汇区','卢湾区'],
['和平区', '河西区', '南开区', '河北区', '河东区', '红桥区', '塘古区', '开发区'],
['俞中区', '南岸区', '江北区', '沙坪坝区', '九龙坡区', '渝北区', '⼤渡⼝区', '北碚区'],
['福⽥区', '罗湖区', '盐⽥区', '宝安区', '龙岗区', '南⼭区', '深圳周边'],
['⼴州市','惠州市','汕头市','珠海市','佛⼭市','中⼭市','东莞市'],
['郑州市']
];
//函数：当省份中的option改变时，城市中的数据应该相应的改变
function select_change(index)
{
var city = document.form1.city;
//根据当前index确定city中要写⼊的⼆维数组是哪⼀个
city.length = 0;
city.length = arr_city[index].length;
for(var i=0;i
{
//创建每⼀个option对象(option标记)
city.options[i].text = arr_city[index][i];
city.options[i].value = arr_city[index][i];
}
html下拉菜单的制作方法}
//函数：给province对象添加option对象，每个option的内容来⾃于arr_province function init()
{
//获取province和city对象
var province = document.form1.province;
var city = document.form1.city;
//指定下拉列表的⾼度，准备写⼊⼏个option的标记(很重要)
province.length = arr_province.length; //这句必须有
//循环数组，将数组内容写⼊到province中去
for(var i=0;i
{
/
/创建每⼀个option对象(option标记)
province.options[i].text = arr_province[i];
province.options[i].value = arr_province[i];
}
//指定省份当前的默认选中索引号
var index = 0;
province.selectedIndex = index;
//对象city的内容来⾃于province的选择
//我们默认指定⼀个option，⼀般是下标为0的那个
city.length = arr_city[index].length;
for(var j=0;j
{
//创建每⼀个option对象(option标记)
city.options[j].text = arr_city[index][j];
city.options[j].value = arr_city[index][j];
}
}
省份：
城市：
希望本⽂所述对⼤家的javascript程序设计有所帮助。
时间： 2016-01-27

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。