JSON省市联动

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8"   />
< script  src ="Area_mini.js"  type ="text/javascript" ></ script >
< script  src ="jquery.js"  type ="text/javascript" ></ script >
< script  type ="text/javascript" >
$(document).ready( function () {
    $( " #areaProvince " ).change( function () {
        LoadCity2();
         // LoadCounty();
    });
     LoadArea2( ' 辽宁 ' ,  ' 沈阳 ' );
});

function  LoadArea2(prov, city) {
    LoadProvince(prov);
    LoadCity2(city);
}
function  LoadArea3(prov, city, County) {
    LoadProvince(prov);
    LoadCity3(city);
    LoadCounty(County);
}
function  LoadProvince(values) {
    $( " #areaProvince " ).empty();
     for  ( var  id  in  countryAreaData) {
        $( " #areaProvince " ).append( "  <option value=' "   +  id  +   " '> "   +  id  +   " </option> " );
    }
     if  ( typeof (values)  ==   " string " ) {
        $( " #areaProvince option[value= "   +  values  +   " ] " ).attr( " selected " ,  true )
    }
}
function  LoadCity3(values) {
    $( " #areaCity " ).empty();
    $( " #areaCounty " ).empty();
     var  s1  =  $( " #areaProvince option:selected " ).val();
     for  ( var  id2  in  countryAreaData[s1]) {

        $( " #areaCity " ).append( "  <option value=' "   +  id2  +   " '> "   +  id2  +   " </option> " );
    }
     if  ( typeof (values)  ==   " string " ) {
        $( " #areaCity option[value= "   +  values  +   " ] " ).attr( " selected " ,  true )
    }
}
function  LoadCity2(values) {
    $( " #areaCity " ).empty();
     var  s1  =  $( " #areaProvince option:selected " ).val();
     for  ( var  id2  in  countryAreaData[s1]) {
        $( " #areaCity " ).append( "  <option value=' "   +  id2  +   " '> "   +  id2  +   " </option> " );
    }
     if  ( typeof (values)  ==   " string " ) {
        $( " #areaCity option[value= "   +  values  +   " ] " ).attr( " selected " ,  true )
    }
}

function  LoadCounty(values) {
    $( " #areaCounty " ).empty();
     var  str1  =  $( " #areaProvince option:selected " ).val();
     var  str2  =  $( " #areaCity option:selected " ).val();

     for  (i  =   0 ; i  <  countryAreaData[str1][str2].length; i ++ ) {
        str  =  countryAreaData[str1][str2][i];
        $( " #areaCounty " ).append( "  <option value=' "   +  str  +   " '> "   +  str  +   " </option> " );
    }
     if  ( typeof (values)  ==   " string " ) {
        $( " #areaCounty option[value= "   +  values  +   " ] " ).attr( " selected " ,  true )

    }
}
</ script >
< title > 无标题文档 </ title >
</ head >

< body >
< select  id ="areaProvince"  name ="areaProvince"  style ="width: 100px" >
     < option  value ="0" > 省份 </ option >
</ select >
< select  id ="areaCity"  name ="areaCity"  style ="width: 120px" >
     < option  value ="0" > 地级市 </ option >
</ select >

</ body >
</ html >

源码下载

 

转载于:https://www.cnblogs.com/skyblue/archive/2011/07/25/2116211.html