<title>省市选择</title>
<script type="text/javascript">
data = {"山东":["青岛","济南","滩坊"],"河南":["郑州","洛阳","三门峡"],"辽宁":["沈阳","大连"]};
function loadProv(){
var prov = document.getElementById("prov");
for(var key in data){
var option = document.createElement("option");
option.value=key;
option.innerText=key;
prov.appendChild(option);
}
}
function provChange(){
var prov = document.getElementById("prov");
var city = document.getElementById("city");
//先清除旧的市列表
//city.options.length=0;
/*
for(var i=0;i<city.childNodes.length;i++)//遍历select 的所有子节点，如果从前向后删，每次都会有“漏网之鱼”，因为有重新排号的问题。也可以每次都删city.childNodes[0]。
{
var option = city.childNodes[i];
city.removeChild(option);
}
*/
for(var i=city.childNodes.length-1;i>=0;i--)//从后向前删，就没有顺序的问题了。
{
var option=city.childNodes[i];
city.removeChild(option);
}
var provName = prov.value;
if(provName=="none"){//如果选择的内容是"请选择省"，则不显示内容。特殊处理！
return;
}
var cities= data[provName];
for(var i=0;i<cities.length;i++){
var option = document.createElement("option");
option.value=cities[i];
option.innerText=cities[i];
city.appendChild(option);
}
}
</script>
</head>
<body οnlοad="loadProv()">
<select id="prov" οnchange="provChange()">
<option value="none">请选择省</option>
</select>
<select id="city"></select>
</body>
</html>
05-23
4618
4618
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
