<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>城市的选择</title>
</head>
<body>
<select id="country" ο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){
/*1.遍历二维数组
2.得到的也是一个数组（国家对于关系）
3.拿到数组中的第一个值和传过来的值作比较
4.如果相同，获得第一个值后面的元素
5.得到cityid的select
6.添加过去（使用）appendChild()方法
-创建option(三步)*/
/*由于每次都要想city里面添加option
第二次添加，追加
每次添加之前，判断一下city里面是否有option*/
//alert("helloS");
//获得cityid里面的select
var city1=document.getElementById("cityid");
//得到city里面的option
var options1=city1.getElementsByTagName("option");
//遍历数组
for(var m=0;m<options1.length;m++){
//得到每一个option
var 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){//相同
//得到第一个值后面的元素
//遍历arr1
for(var j=1;j<arr1.length;j++){
var value1=arr1[j];//得到城市的名称
//创建option
var option1=document.createElement("option");
//创建文本
var text1=document.createTextNode(value1);
//将文本添加到option里面
option1.appendChild(text1);
//添加到city1里面
city1.appendChild(option1);
i--;
}
}
}
}
</script>
<html>
<head>
<meta charset="UTF-8">
<title>城市的选择</title>
</head>
<body>
<select id="country" ο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){
/*1.遍历二维数组
2.得到的也是一个数组（国家对于关系）
3.拿到数组中的第一个值和传过来的值作比较
4.如果相同，获得第一个值后面的元素
5.得到cityid的select
6.添加过去（使用）appendChild()方法
-创建option(三步)*/
/*由于每次都要想city里面添加option
第二次添加，追加
每次添加之前，判断一下city里面是否有option*/
//alert("helloS");
//获得cityid里面的select
var city1=document.getElementById("cityid");
//得到city里面的option
var options1=city1.getElementsByTagName("option");
//遍历数组
for(var m=0;m<options1.length;m++){
//得到每一个option
var 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){//相同
//得到第一个值后面的元素
//遍历arr1
for(var j=1;j<arr1.length;j++){
var value1=arr1[j];//得到城市的名称
//创建option
var option1=document.createElement("option");
//创建文本
var text1=document.createTextNode(value1);
//将文本添加到option里面
option1.appendChild(text1);
//添加到city1里面
city1.appendChild(option1);
i--;
}
}
}
}
</script>
</html>
625
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
