js json省市二级联动菜单(json+select)

来源:互联网 发布:arm软件侵权赔偿 编辑:程序博客网 时间:2024/04/19 21:20
<html>


<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>test</title>
<script>
var areaList={ 
"v100":[["选择城区"],["东城区"],["西城区"],["崇文区"],["宣武区"],["朝阳区"],["丰台区" ],["石景山区" ],["海淀区" ],["门头沟区" ],["房山区" ],["通州区" ],["顺义区" ],["延庆县" ],["昌平县" ],["怀柔县" ],["密云县" ],["平谷县" ],["大兴县" ]], 
"v200":[["选择城区"],["和平区" ],["河东区" ],["河西区" ],["南开区" ],["河北区" ],["红桥区" ],["塘沽区" ],["大港区" ],["汉沽区" ],["东丽区" ],["西青区" ],["津南区" ],["北辰区" ],["蓟县","22"],["宝坻县" ],["武清县" ],["宁河县" ],["静海县" ]], 
"v300":[["选择城区"],["南市区" ],["卢湾区" ],["徐汇区" ],["长宁区" ],["静安区" ],["普陀区" ],["闸北区" ],["虹口区" ],["杨浦区" ],["闵行区" ],["宝山区" ],["嘉定区" ],["浦东新区" ],["金山区" ],["松江区" ],["崇明县" ],["青浦县" ],["南汇县" ],["奉贤县" ],["黄浦区" ]] 
};


function province_change(v){
var city = document.getElementById("city");
city.innerHTML = "";
eval("var citys = areaList.v"+v+";");
for(var i=0;i<citys.length;i++){
city.add(new Option(citys[i],citys[i]));
}
}
</script>
</head>


<body onLoad="province_change(document.getElementById('province').value)">
<form name="dataForm"  id="dataForm" action="" method="POST" target="dataFrame"  style="margin: 0"> 
<div class="InnerDiv" style="width: 780px;"> 
    <table align=right border=0 style="height:150; width:100%">  
        <tr> 
            <td nowrap align=right>所在省份: </td> 
            <td> <select name=province id=province style="width:100px" onChange="province_change(this.value)"> 
            <option value=100>北京</option>
<option value=200>天津</option>
<option value=300>上海</option>
 </select> </td> 
            <td nowrap align=right>所在城市: </td> 
            <td> <select name=city id=city></select> </td> 
        </tr>    
    </table> 
</div> 
</form> 


</body>


</html>
原创粉丝点击