jquery provincial three-level linkage (data source National Bureau of Statistics) with source download

It's been a long time since I wrote a blog.

Today, the project has updated the provincial three-level linkage data, updated after the latest Hainan three sand have, share to all the needs of the small partners ...

JQUERY + JSON, no database, pure JS code, no encryption, no compression, can be used directly in any project.

Data from the official website of NBS.

First:

Bound to the provincial city

How to use:

1. Refer to jquery <script type= "Text/javascript" src= "Http://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js" >< /script>

2. Reference to provincial and municipal data <script type= "Text/javascript" src= "Pdata.js" ></script>

3. HTML code:

1 <Divclass= "Row">2     <Divclass= "Col-sm-12">3         <Divclass= "Form-group">4             <labelclass= "Control-label col-sm-2">Area</label>5             <Divclass= "Col-sm-3">6                 <Selectname= "Input_province"ID= "Input_province"class= "Form-control">7                 </Select>8             </Div>9             <Divclass= "Col-sm-3">Ten                 <Selectname= "Input_city"ID= "Input_city"class= "Form-control"> One                 </Select> A             </Div> -             <Divclass= "Col-sm-3"> -                 <Selectname= "Input_area"ID= "Input_area"class= "Form-control"> the                 </Select> -             </Div> -         </Div> -     </Div> + </Div>

4. JS Code:

1$(function () {2         varhtml = "<option value=" >== Please select ==</option> "; $ ("#input_city"). Append (HTML); $ ("#input_area"). append (HTML);3$.each (pdata,function(idx,item) {4             if(parseint (item.level) = = 0) {5HTML + = "<option value=" + item.names + "' exid= '" + Item.code + ">" + item.names + "</option>";6                }7         });8$ ("#input_province"). append (HTML);9 Ten$ ("#input_province"). Change (function(){ One             if($( This). val () = = "")return; A$ ("#input_city option"). Remove (); $ ("#input_area option"). Remove (); -             varCode = $ ( This). Find ("option:selected"). attr ("Exid"); Code = code.substring (0,2); -             varhtml = "<option value=" >== Please select ==</option> "; $ ("#input_area"). append (HTML); the$.each (pdata,function(idx,item) { -                 if(parseint (item.level) = = 1 && Code = = Item.code.substring (0,2)) { -HTML + = "<option value=" + item.names + "' exid= '" + Item.code + ">" + item.names + "</option>"; -                    } +             }); -$ ("#input_city"). append (HTML);  +         }); A  at$ ("#input_city"). Change (function(){ -             if($( This). val () = = "")return; -$ ("#input_area option"). Remove (); -             varCode = $ ( This). Find ("option:selected"). attr ("Exid"); Code = code.substring (0,4); -             varhtml = "<option value=" >== Please select ==</option> "; -$.each (pdata,function(idx,item) { in                 if(parseint (item.level) = = 2 && Code = = Item.code.substring (0,4)) { -HTML + = "<option value=" + item.names + "' exid= '" + Item.code + ">" + item.names + "</option>"; to                    } +             }); -$ ("#input_area"). append (HTML);  the         }); *         //binding $$ ("#input_province"). Val ("Guangdong province"); $ ("#input_province"). Change ();Panax Notoginseng$ ("#input_city"). Val ("Shenzhen"); $ ("#input_city"). Change (); -$ ("#input_area"). Val ("Luohu"); the  +});

SOURCE download: Click to download, unzip the password im531

XXX Company and the sudden death of God,,, life is the capital of revolution, wash sleep ...

jquery provincial three-level linkage (data source National Bureau of Statistics) with source download