<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-1.8.3.js"></script>
<script>
$(function(){
var city=new Array(3);
city[0]=new Array("武汉","黄冈","襄阳","雷军");
city[1]=new Array("长沙","韶山","岳阳楼","张家界");
city[2]=new Array("石家庄","唐山","保定市","廊坊");
city[3]=new Array("商丘","信阳","洛阳","安阳");
$("#province").change(function(){
$("#city").empty();
var val=this.value;
console.log(val);
$.each(city, function(i,n) {
if(val==i){
$.each(city[i], function(j,m) {
var txt=document.createTextNode(m);
var op=document.createElement("option");
$(op).append(txt);
$(op).appendTo("#city");
});
}
});
})
})
</script>
</head>
<body>
<select id="province">
<option>===请选择===</option>
<option value="0">湖北</option>
<option value="1">湖南</option>
<option value="2">河北</option>
<option value="3">河南</option>
</select>
<select id="city">
</select>
</body>
</html>
