制作省份城市选择列表
如果您发现本文排版有问题,可以先点击下面的链接切换至老版进行查看!!!
制作省份城市选择列表

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>城市列表</title>
<script src="CitysData.js" ></script>
</head>
<body>
<script>
function cc(sf, cs) {
document.write('<select onchange="select(this)" id="provinces">');
document.write('<option value="">--选择省份--</option>');
var a = 0;
for (var i = 0; i < arrCity.length; i++) {
if (typeof(sf) != "undefined") {
if (arrCity[i]["name"] == sf) {
var sel = "selected";
a = i;
} else {
var sel = "";
}
}
document.write('<option ' + sel + ' value="' + arrCity[i]["name"] + '">' + arrCity[i]["name"] + '</option>');
}
document.write("</select>");
document.write('<select id="citys" name="+cname+">');
document.write('<option value="">--选择城市--</option>');
document.write("</select>");
if (a > 0) {
select(document.getElementById("provinces"), cs, a);
}
}
function select(proobj, cs, a) {
if (typeof(a) != "undefined") {
var index = a;
} else {
var index = proobj.selectedIndex - 1;
}
var citys = document.getElementById("citys");
var sub = arrCity[index]["sub"];
citys.innerHTML = "";
for (var i = 0; i < sub.length; i++) {
if (sub[i]["name"] == cs) {
var sel = "selected";
} else {
var sel = "";
}
var option = document.createElement("option");
var text = sub[i]["name"];
//console.log(text);
option.value = text;
option.selected = sel;
option.innerHTML = text;
citys.appendChild(option);
}
}
//用户默认的省份是湖北,城市是武汉
cc("湖北", "武汉");
</script>
</body>
</html>
里面的函数“cc”是显示省份,函数“select”是根据用户选定的省份,响应的显示该省管辖的城市。
上面引用的CitysData.js文件里面包含的中国所有的省份名和城市名,用的是百度的数据,地址是城市数据地址,可能部分需要更新。- 分类:
- 吐槽
更新时间: