js实现省市联动

最新推荐文章于 2024-06-16 14:06:27 发布

desedematong

最新推荐文章于 2024-06-16 14:06:27 发布

阅读量461

点赞数

分类专栏： JS javascript JS

本文链接：https://blog.csdn.net/desedematong/article/details/53405835

版权

JS javascript 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

4 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
   <title></title>
</head>
<body>
<select id="countryid" οnchange="add1(this.value);">
    <option value="0">请选择</option>
   <option value="中国">中国</option>
   <option value="美国">美国</option>
    <option value="德国">德国</option>
   <option value="日本">日本</option>
</select>
<select id="cityid">

</select>
</body>
<script type="text/javascript">
   // 创建数组存储数据
   var arr= new Array(4);
   arr[0]=["中国","南京","日喀则","哈密","哈尔滨"];
   arr[1]=["美国","纽约","休斯顿","底特律"];
   arr[2]=["德国","斯图加特","慕尼黑","法兰克福"];
   arr[3]=["日本","东京","广岛","长崎"];

   function add1(val){
       // 删除city的option
   var city1= document.getElementById("cityid");
   var options1=city1.getElementsByTagName("option");
   for (var m = 0;m < options1.length;m++) {

       // 的到每一个option
       var op=options1[m];
       city1.removeChild(op);
       m--;
   }
// 遍历二维数组
for (var i=0;i<arr.length;i++){
   var arr1=arr[i];
   var firstvalue=arr1[0];
   if(firstvalue==val){
       for (var j=1;j<arr1.length; j++) {
           var value1=arr1[j];
           // alert(value1);
           // 创建option
           var option1=document.createElement("option");
       // 创建文本
       var text1=document.createTextNode(value1);
       // 把文本添加到option1里面
       option1.appendChild(text1);
       // 添加到city里
           city1.appendChild(option1);
       }
   }
   }
}
</script>
</html>

desedematong

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js实现省市联动

请选择中国美国德国日本 // 创建数组存储数据 var arr= new Array(4); arr[0]=["中国","南京","日喀则","哈密","哈尔滨"]; arr[1]=["美国","纽约","休斯顿","底特律"]; arr[2]=["德国","斯图加特","慕尼
复制链接

扫一扫

专栏目录