<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title></title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta content="always" name="referrer">
<meta name="theme-color" content="#2932e1">
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
</head>
<body>
<select id="province" >
<option value="">省份</option>
option
</select>
<select name="city" id="city">
<option value="">地区</option>
</select>
<script type="text/javascript">
var prva =new Array(['1','北京','0'],['2','河北','0'],['3','天津','0'],['4','朝阳','1'],['5','海淀','1'],['6','石家庄','2'],['7','邯郸','2'],['8','静海','3'],['9','谷开','3']);
/*loadprva('province');
function loadprva(id){
var province = document.getElementById(id);
for(var i=0;i<prva.length;i++){
if(prva[i][2]==0){
province.options[province.length]=new Option(prva[i][1],prva[i][2]);
}
}
province.onchange = function() {
loadCity(this,'city');
}
}
function loadCity(obj,id){
var obj1=document.getElementById(id);
var index=obj.selectedIndex;
obj1.length=1;
for(var j=0;j<prva.length;j++){
if(prva[j][2]==index&&index!=0){
obj1.options[obj1.length]=new Option(prva[j][1],prva[j][2]);
}
}
}*/
var prv=$("#province");
var city=$("#city");
$.each(prva,function(i,item){
if(item[2]==0){
prv.append("<option value='新增'>"+item[1]+"</option>");
}
})
prv.change(function(){
var p=$("#province option:selected").index();
$('#city option').eq(0).siblings().remove();
$.each(prva,function(i,item){
if(item[2]==p){
city.append('<option value="x">'+item[1]+"</option>");
}
})
})
</script>
</body>
</html>
