Home > Developer > Web Develop
Use Ajax + three-level linkage to classify the provinces, municipalities, and districts across the country
The following display page can also be written in the function loop, encapsulated into a JS file, is to write code software to create a JS file, and create an HTML or PHP file. Directly in the Display page reference!
<! DOCTYPE HTML Public"-//W3C//DTD XHTML 1.0 transitional//en" "HTTP://WWW.W3.ORG/TR/XHTML1/DTD/XHTML1-TRANSITIONAL.DTD">"http://www.w3.org/1999/xhtml">"Content-type"Content="text/html; Charset=utf-8"/><script src=".. /jquery-1.11.2.min.js"></script><title> Untitled Document </title>
<br/>
<div id="SJ"></div><body><script type="Text/javascript">$ (document). Ready (function (e) {//Create a drop-down menu in Div$("#sj"). HTML ("<select id= ' sheng ' ></select><select id= ' shi ' ></select><select id= ' qu ' ></ Select>"); //fill data using the Fill keywordFillsheng ();//populating the province's dataFillshi ();//populating the city's dataFillqu ();//data for populated areas//ways to fill the provincefunction Fillsheng () {varCode ="0001";//Province's parent code$.ajax ({URL:"sheng_2_chuli.php", Data:{code:code}, type:"POST", DataType:"TEXT", Async:false, Success:function (data) {varHang = Data.split ("|"); varstr =""; for(varI=0; i){ varLie = Hang[i].split ("^"); STR+="<option value= '"+lie[0]+"' >"+lie[1]+"</option>"; } //Put all <option> in the province drop-down list$("#sheng"). html (str); } }); } //methods of filling the cityfunction Fillshi () {varCode = $ ("#sheng"). Val ();//City's parent code$.ajax ({URL:"sheng_2_chuli.php", Data:{code:code}, type:"POST", DataType:"TEXT", Async:false, Success:function (data) {varHang = Data.split ("|"); varstr =""; for(varI=0; i){ varLie = Hang[i].split ("^"); STR+="<option value= '"+lie[0]+"' >"+lie[1]+"</option>"; } //Put all <option> in the city drop- down list$("#shi"). html (str); } }); } //methods for populating the areafunction Fillqu () {varCode = $ ("#shi"). Val ();//The parent code of the zone$.ajax ({URL:"sheng_2_chuli.php", Data:{code:code}, type:"POST", DataType:"TEXT", Async:false, Success:function (data) {varHang = Data.split ("|"); varstr =""; for(varI=0; i){ varLie = Hang[i].split ("^"); STR+="<option value= '"+lie[0]+"' >"+lie[1]+"</option>"; } //Put all <option> in the drop-down list of the area$("#qu"). html (str); } }); } //when clicking on which province to select, the city and the district change together$("#sheng"). Change (function () {Fillshi (); Fillqu (); }); //when you click on which city to select, the district changes$("#shi"). Change (function () {Fillqi (); }); });</script></body>
Working with pages
<? phpinclude (".. /dbda.class.php"new= $_post["code" "select Areacode,areaname from chinastates where Parentareacode = ' {$pcode} '" ; Echo $db-strquery ($sql);? >Use AJAX + three-level linkage to classify the provinces, cities, and districts across the country
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
