1<! DOCTYPE html>234<meta CHARSET=GBK/>5<title>selectList</title>6<style type="Text/css">7*{margin:0;p adding:0;}8 . selectlist{width:200px;margin:50px Auto;}9</style>Ten<script type="Text/javascript"Src="Jquery1.7.1.js"></script> One A<body> -<divclass="SelectList"> -<Select class="Province"> the<option> Please select </option> -</Select> -<Select class=" City"> -<option> Please select </option> +</Select> -<Select class="District"> +<option> Please select </option> A</Select> at</div> -<divclass="SelectList"> -<Select class="Province"> -<option> Please select </option> -</Select> -<Select class=" City"> in<option> Please select </option> -</Select> to<Select class="District"> +<option> Please select </option> -</Select> the</div> *<script type="Text/javascript"> $ $ (function () {Panax Notoginseng$(". SelectList"). each (function () { - varURL ="Area.json"; the varAreajson; + vartemp_html; A varOprovince = $ ( This). Find (". Province"); the varOcity = $ ( This). Find (". City"); + varOdistrict = $ ( This). Find (". District"); - //Initialize province $ varProvince =function () { $ $.each (areajson,function (i,province) { -temp_html+="<option value= '"+province.p+"' >"+province.p+"</option>"; - }); the oprovince.html (temp_html); - City ();Wuyi }; the //Value City - varCity =function () { Wutemp_html =""; - varn = oprovince.Get(0). SelectedIndex; About $.each (areajson[n].c,function (i,city) { $temp_html+="<option value= '"+city.ct+"' >"+city.ct+"</option>"; - }); - ocity.html (temp_html); - district (); A }; + //Assignment Counties the vardistrict =function () { -temp_html =""; $ varm = oprovince.Get(0). SelectedIndex; the varn = ocity.Get(0). SelectedIndex; the if(typeof(AREAJSON[M].C[N].D) = ="undefined"){ theODISTRICT.CSS ("Display","None"); the}Else{ -ODISTRICT.CSS ("Display","inline"); in $.each (areajson[m].c[n].d,function (i,district) { thetemp_html+="<option value= '"+district.dt+"' >"+district.dt+"</option>"; the }); About odistrict.html (temp_html); the }; the }; the //Select Province to change the city + Oprovince.change (function () { - City (); the });Bayi //Select City to Change County the Ocity.change (function () { the district (); - }); - //Get JSON data the $.getjson (url,function (data) { theAreajson =data; the province (); the }); - }); the }); the</script> the</body>94SELECT three level linkage [turn]