jquery如何实现省市区联动的选择功能

//先定义几个省市区数据
varprovinceData=[
{id:'110101',name:'东城区'},
{id:'110102',name:'西城区'},
{id:'110105',name:'朝阳区'},
//...
];

varcityData=[
{id:'110101',name:'北京市'},
{id:'110201',name:'天津市'},
{id:'120101',name:'上海市'},
//...
];

vardistrictData=[
{id:'110101001',name:'东华门街道'},
{id:'110101002',name:'景山街道'},
{id:'110101003',name:'交道口街道'},
//...
];

//动态加载省份数据
$.each(provinceData,function(index,value){
$('#province').append(''+value.name+'');
});

//根据省份信息动态加载城市数据
$('#province').on('change',function(){
varselectProvince=$(this).val();
$('#city').empty();
$('#district').empty();
if(selectPr免费云主机、域名ovince===''){
$('#city').prop('disabled',true);
$('#district').prop('disabled',true);
}else{
$('#city').prop('disabled',false);
$('#district').prop('disabled',true);
$.each(cityData,function(index,value){
if(value.id.substring(0,2)===selectProvince.substring(0,2)){
$('#city').append(''+value.name+'');
}
})
}
});

//根据城市信息动态加载区数据
$('#city').on('change',function(){
varselectCity=$(this).val();
$('#district').empty();
if(selectCity===''){
$('#district').prop('disabled',true);
}else{
$('#district').prop('disabled',false);
$.each(districtData,function(index,value){
if(value.id.substring(0,4)===selectCity.substring(0,4)){
$('#district').append(''+value.name+'');
}
})
}
});