Javascript实现二级select联动

最新推荐文章于 2021-05-27 17:32:55 发布

l2535460824

最新推荐文章于 2021-05-27 17:32:55 发布

阅读量410

点赞数

分类专栏： js

js 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form name="form1">
<select name="country" onChange="getCity()" >
<option value="0">请选择所在的国家</option>
<option value="1">中国</option>
<option value="2">美国</option>
<option value="3">英国</option>
<option value="4">意大利</option>
</select>
<select name="city">
<option value="0">请选择所在的城市 </option>
</select>
</form>
</body>
<script type="text/javascript">
//定义一个二维数组
var city=[
["北京","上海","广州","深圳"],
["华盛顿","纽约","旧金山","西雅图"],
["剑桥","伦敦","苏格兰地区","北爱尔兰地区"],
["罗马","米兰","威尼斯","都灵"]
];
function getCity(){
var sltCountry=document.form1.country; //获得国家下拉框的对象
var sltCity=document.form1.city; //获得城市下拉框的对象
var country=city[sltCountry.selectedIndex-1]; //得到对应国家的城市数组
sltCity.length=1; //清空城市下拉框，仅留提示选项。
//通过for循环，将城市中的值填充到城市下拉框中
for(var i=0;i<country.length;i++){
sltCity[i+1]=new Option(country[i],country[i]);
}
}
</script>
</html>

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
Javascript实现二级select联动

&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt
复制链接

扫一扫

专栏目录

评论 1

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。