版权声明：署名，允许他人基于本文进行创作，且必须基于与原先许可协议相同的许可协议分发本文 （Creative Commons） <script type="text/javascript"> $(function(){ $.post( "city/first", function(data){ var tempArr=""; if(data!=""){ for(var i=0;i<data.length;i++){ tempArr+="<option value='"+data[i].code+"'>"+data[i].name+"</option>"; } $("#province").append(tempArr); } }, "json" ); $("#province").change(function(){ var pId=$(this).val(); getCitys(pId); }); $("#city").change(function(){ var cId=$(this).val(); getAreas(cId); }); getCitys(110000); getAreas(110100); }); //----------------------------------- function getCitys(pId){ $.post( "city/second", {provinceId:pId}, function(data){ var tempArr=""; if(data!=""){ $("#city").empty(); for(var i=0;i<data.length;i++){ tempArr+="<option value='"+data[i].code+"'>"+data[i].name+"</option>"; } $("#city").append(tempArr); getCitys(data[0].code); } }, "json" ); } //----------------------------- function getAreas(cId){ $.post( "city/third", {cityId:cId}, function(data){ var tempArr=""; if(data!=""){ $("#area").empty(); for(var i=0;i<data.length;i++){ tempArr+="<option value='"+data[i].code+"'>"+data[i].name+"</option>"; } $("#area").append(tempArr); getAreas(data[0].code); } }, "json" ); } </script> </head> <body> <center> <table> <tr> <td>选择省：</td> <td><select id="province"></select></td> </tr> <tr> <td>选择市：</td> <td><select id="city"></select></td> </tr> <tr> <td>选择区：</td> <td><select id="area"></select></td> </tr> </table> </center> </body> </body> </html> 文章来源: https://blog.csdn.net/weixin_44001965/article/details/92574729