<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>js_tag.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
window.οnlοad=function(){
//js数组 来存放 采用的js的原生格式
var provinces=[
{
id:'1',
name:'北京',
city:['海淀区','朝阳区','大兴区']
},
{
id:'2',
name:'天津',
city:['北辰区','和平区','虹桥区']
},
{
id:'3',
name:'上海',
city:['上海a','上海B区','上海C区']
},
{
id:'4',
name:'重庆',
city:['AA区','BB区','CC区']
}
];
var domprovinces=document.getElementById("province");
//当页面已加载 就把省份显示的操作
for(var i=0;i<provinces.length;i++){
//获取具体的省份对象
var pro=provinces[i];
//创建option标签
var option=document.createElement("option");
//为option标签添加value属性
option.setAttribute("value",pro.id);
//创建一个文本节点
var textNode=document.createTextNode(pro.name);
//添加到option节点中
option.appendChild(textNode);//为创建的元素节点添加子节点
//添加到id=province的select标签中
domprovinces.appendChild(option);//把创建的元素节点添加到指定的节点中
}
var domcity=document.getElementById("city");
//当省份发生改变的时候，就把响应的市区显示给客户
domprovinces.οnchange=function(){
//清楚数据(把上次浏览保留的数据清除掉)
domcity.length=1;
//添加
for(var i=0;i<provinces.length;i++){
//获取具体省份
var dompro=provinces[i];
if(this.value==dompro.id){
var city=dompro.city;
for(var j=0;j<city.length;j++){
var doption=document.createElement("option");
var dtextNode=document.createTextNode(city[j]);
//添加到option中
doption.appendChild(dtextNode);
domcity.appendChild(doption);
}
break;
}else{
continue;
}
}
};
};
</script>
</head>
<body>
<select id="province">
<option value="-1">请选择省份</option>
</select>
<select id="city">
<option value="-1">请选择市区</option>
</select>
</body>
</html>
1362
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
