Date:2018/11/17
效果图,籍贯选湖北,然后后面就会出现湖北的地级市:
源代码:
<!--
1、事件(onchange);
2、创建二维数组存储省份和城市;(数组长度 = 最大角标+1)
3、获取用户选择的省份(使用方法传参的方式:this.value);
4、遍历数组,获取省份,与用户选择的省份作比较,相同,继续遍历该省份下所有城市;
5、创建文本节点和元素节点,并添加;createTextNode createElement appendChild
6、最后用city2.options.length = 0将第二个选择表里面的数据清空;
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册页面重新布局</title>
<style type="text/css">
.top{
border: 1px solid red;
width: 32.9%;
height: 50px;
float: left;
}
#clear{
clear: both;
}
#menu{
border: 1px solid blue;
width: 99%;
height: 40px;
background-color: black;
}
#menu ul li{
display: inline;
color: white;
font-size: 19px;
}
#bottom{
text-align: center;
}
#contanier{
border: 1px solid red;
width: 99%;
height: 600px;
background: url(../img/regist_bg.jpg);
position: relative;
}
#content{
border: 5px solid gray;
width: 50%;
height: 60%;
position: absolute;
top: 100px;
left: 300px;
background-color: white;
padding-top: 50px;
}
</style>
<script>
//创建数组存储省市;
var cities = new Array(3);
cities[0] = new Array("湖北1","湖北2","湖北3","湖北4");
cities[1] = new Array