JavaScript基础——省市联动

来源:互联网 发布:淘宝客全店推广如何做 编辑:程序博客网 时间:2024/05/16 17:50
<head>  <meta charset="UTF-8">  <title>Document</title> </head> <body>  <select id="countryid" onchange="add1(this.value);"> <option value="0">--请选择--</option><option value="中国">中国</option><option value="美国">美国</option><option value="日本">日本</option>  </select>  <select id="cityid">  </select> </body> <script type="text/javascript"> <!-- //创建一个数组储存数据 //二维数组 var arr=new Array(3); arr[0]=["中国","南京","广州"]; arr[1]=["日本","东京","北海道"];  arr[2]=["美国","纽约","华盛顿"];function add1(val){/*1.遍历二维数组2.得到也是一个数组(国家对应关系)3.拿到数组中的第一个值和传递过来的值作比较4.如果相同,获取到第一个值后面的元素。5.得到city的select6.添加过去(使用)appendChild方法                   -创建option(三步)*/var city1=document.getElementById("cityid");//得到city里面的optionvar options1=city1.getElementsByTagName("option");//遍历数组for(var m=0;m<options1.length;m++){//得到每一个optionvar op=options1[m];//删除这个option 通过父节点删除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];//得到城市的名称//创建optionvar option1=document.createElement("option");//创建文本var text1=document.createTextNode(value1);//把文本添加到option1里面option1.appendChild(text1); //添加值到city1里面city1.appendChild(option1);}}}} //--> </script></html>

原创粉丝点击