<!DOCTYPE html> <html> <head> <Meta charset="UTF-8"> <title></title> </head> <body> <div> <select class="province"> <option>---选择省---</option> </select> <select class="city"> <option>---选择市---</option> </select> <select class="coding"> <option>---选择编码---</option> </select> </div> </body> <script src="jquery-3.3.1/jquery-3.3.1.min.js"></script> <script type="text/javascript"> $.get("city.json",function(data,status){ //get获取数据 if (status) { //找到数据的时候执行 $.each(data.城市代码,function(i,el) { //遍历城市代码 var str = "<option>"+el.省+"</option>"; //找出省 $(".province").append(str); //添加到选择区 }); $(".province").change(function(){ //当省变动的时候 $(".city").html("<option>---选择市---</option>") //清除上一次选的城市 $(".coding").html("<option>---选择编码---</option>") //清除上一次选的编码 $(data.城市代码).each(function(i,el){ if ($(".province").val() == el.省) { //找到所选取的省 因为省和市的下标是一致的 $(el.市).each(function(index,ele){ //遍历所有找到的市 var str = "<option>"+ele.市名+"</option>" //找出市名 $(".city").append(str); }) } }) }) $(".city").change(function(){ //当市变动的时候 $(data.城市代码).each(function(i,el){ if ($(".province").val() == el.省) { $(el.市).each(function(index,ele){ if ($(".city").val() == ele.市名){ //找到选取的市名 var str = "<option>"+ele.编码+"</option>" //编码跟市名同级 $(".coding").html(str); //替换编码的内容 } }) } }) }) } }) </script> </html>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
