Realisieren Sie eine dreistufige Verknüpfung von Provinzen, Städten, Bezirken und Kreisen basierend auf Jquery

前端感觉写的比较少，也是为了练手，下午没事用来写了这个三级联动，也是第一次写这东西。

据我了解，城市信息可以选择存在数据库或者直接写在前端，为了省事，我直接写在前端，下面是我的代码：

“;>




<script><br>$(document).ready(function(){<br>//省份城市数组<br>var fujian_city = new Array(‘福州’,’漳州’,’厦门’,’龙岩’,’泉州’,’南平’,’莆田’,’宁德’,’三明’);<br>var guangdong_city = new Array(‘广州’,’深圳’,’东莞’,’潮州’,’河源’,’汕头’,’珠海’,’佛山’,’肇庆’,’韶关’);</p> <p>//城市下属区县数组<br>var fuzhou_county = new Array(‘鼓楼区’,’台江区’,’平潭’,’晋安区’,’马尾区’,’福清市’,’长乐市’,’闽侯县’,’连江县’,’闽清县’);<br>var zhangzhou_county = new Array(‘芗城区’,’龙文区’,’南靖县’,’平和县’,’龙海市’,’东山县’,’华安县’);<br>var xiamen_county = new Array(‘湖里区’,’思明区’,’海沧区’,’集美区’,’同安县’,’翔安区’);<br>//获取省份改变的事件，并设置被选择省份城市信息<br>$(“#province”).change(function(){<br>//清空每次选择留下的城市信息<br>$(“#city”).find(“option”).remove();<br>//设置未选择的城市默认状态<br>$(“#city”).append(‘<option value=”未选择”>未选择</option>’);<br>//获取被选中省份的值<br>var province=$(“#province”).val();<br>//设置城市的自定义函数<br>$.extend({set_cities:function(province){<br>var arr_length = province.length;<br>for(var i=1;i<=arr_length;i++){<br/>var place_info = ‘<option value=’+province[i-1]+’>’+province[i-1]+'</option>’;<br>$(“#city”).append(place_info);<br>}<br>}});<br>switch(province){<br>case ‘福建’:<br>$.set_cities(fujian_city);<br>break;<br>case ‘广东’:<br>$.set_cities( guangdong_city);<br>break;<br>default :<br>alert(‘没有写信息的省份，这里只展示福建和广东两个省份’);<br>}<br>})<br>//获取改变城市的事件，并设置区县信息，这里只写了福建的福州、漳州、厦门的部分城市信息<br>$(“#city”).change(function(){<br>//清空每次选择留下的区县信息<br>$(“#county”).find(“option”).remove();<br>//设置未选择的区县默认状态<br>$(“#county”).append(‘<option value=”未选择”>未选择</option>’);<br>//获取被选中城市的值<br>var city=$(“#city “).val();<br>//设置区县的自定义函数<br>$.extend({set_counties:function(city){<br>var arr_length = city.length;<br>for(var i=1;i<=arr_length;i++){<br/>var place_info = ‘<option value=’+city[i-1]+’>’+city[i-1]+'</option>’;<br>$(“#county”).append(place_info);<br>}<br>}});<br>switch(city){<br>case ‘福州’:<br>$.set_counties(fuzhou_county);<br>break;<br>case ‘厦门’:<br>$.set_counties( xiamen_county);<br>break;<br>case ‘漳州’:<br>$.set_counties( zhangzhou_county);<br>break;<br>default :<br>alert(‘这里只写了福建的福州、漳州、厦门的部分城市信息’);<br>}<br>})<br>});<br></script>

• 
  福建
  广东
  浙江
  江西
  
  




• 
  未选择
  
  



• 
  
  未选择
  
  

Die Wirkung ist wie folgt:

Hauptsächlich dafür Funktion gibt es einige Hinweise zu den relevanten Codes, die leicht zu verstehen sind. Wenn Sie es verwenden möchten, können Sie direkt weiterhin Provinz- und Stadtdaten hinzufügen oder Ajax verwenden, um Daten abzurufen. Wenn Sie den Code nicht verstehen, können Sie eine Nachricht hinterlassen oder mich kontaktieren.

Das obige ist der detaillierte Inhalt vonRealisieren Sie eine dreistufige Verknüpfung von Provinzen, Städten, Bezirken und Kreisen basierend auf Jquery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!