JavaScript【省市级联】
来源:互联网 发布:linux 切换主机 编辑:程序博客网 时间:2024/04/28 07:24
CSS代码:<script type="text/javascript"> function changeShow(){ var city= new Array; city["河北省"]=["--请选择城市--","邯郸市","石家庄","秦皇岛","武安市","邢台市","廊坊市","沧州市","合肥市"]; city["hebei"]=["select","handan","shijiazhuang","qinhuangdao","wuan","xingtai","langfang","cangzhou","hefei"]; city["山东省"]=["--请选择城市--","不知道"]; city["shangdong"]=["select","buzhidao"]; city["北京市"]=["--请选择城市--","海淀区","宣武区","朝阳区","东城区"]; city["biejing"]=["select","haidian","xuanwu","chaoyang","dongcheng"]; var cityvalue= document.getElementById("sheng").value; switch(cityvalue){ case "河北省": document.getElementById("shi").options.length = 0; for(var i=0;i<city["河北省"].length;i++){ document.getElementById("shi").options.add(new Option(city["河北省"][i], city["hebei"][i])); } break; case "山东省": document.getElementById("shi").options.length = 0; for(var i=0;i<city["山东省"].length;i++){ document.getElementById("shi").options.add(new Option(city["山东省"][i], city["shangdong"][i])); } break; case "北京市": document.getElementById("shi").options.length = 0; for(var i=0;i<city["北京市"].length;i++){ document.getElementById("shi").options.add(new Option(city["北京市"][i], city["biejing"][i])); } break; } }</script>
HTML代码:<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>省市级联</title></head><body><select id="sheng" onchange="changeShow()"><option value="" selected="selected">--请选择省份--</option><option value="河北省">河北省</option><option value="山东省">山东省</option><option value="北京市">北京市</option></select><select id="shi" ><option value="" selected="selected">--请选择市区--</option></select></body></html>