JavaScript+HTML实现简单的省市二级联调
程序员文章站
2024-03-26 08:57:23
...
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简单的省市联调</title>
</head>
<body>
</body>
</html>
<script>
var provinces = ['请选择城市','湖北省','湖南省'];
var city1 = ['武汉市','荆州市','襄阳市'];
var city2 = ['长沙市','岳阳市','湘潭市'];
//生成有数据的省的下拉框
document.write("<select name='selPro' onchange='showCity(this)'>");
for(var i = 0;i<provinces.length;i++){
document.write("<option value='"+i+"'>"+provinces[i]+"</option>");
}
document.write("</select>");
document.write("<select name='selCity'></select>");
//将HTML写入到select中实现调用
function showCity(obj){
var content = "";
if(obj.value==1){
for(var i = 0;i<city1.length;i++){
content = content + "<option value='"+i+"'>"+city1[i]+"</option>";
}
}else if(obj.value==2){
for(var i = 0;i<city2.length;i++){
content = content + "<option value='"+i+"'>"+city2[i]+"</option>";
}
}
document.getElementsByName("selCity")[0].innerHTML = content;
}
</script>
上一篇: Java方法定义
下一篇: gcc工作流程:预处理,编译,汇编,链接