为了账号安全,请及时绑定邮箱和手机立即绑定

关于ajax+json+jquery二级联动

通过省的id去查询市和学校
核心代码:
<script>
$(document).ready(function(){
$.ajax({
url :'http://localhost:8080/fullstack/api/signUp/plist ',
type : "get",
async:true,
dataType : 'json', //以json的形式返回,易解析 "json",
success: function(plist){
$("#select_province").empty();// jq写法 清楚地区下拉框的所有内容,然后拼接上从后台取出来的数据
$("<option value=''>请选择</option>").appendTo("#select_province");
for(var i=0;i<plist.length;i++){//获取plist里面的数据,拼接到select上
$("#select_province").append("<option value='"+plist[i].id+"'>"+plist[i].province_name+"</option>");
}
},
});
$("#select_province").change(function(){
var id={"id":$("#select_province").val()};
$.ajax({
url : 'http://localhost:8080/fullstack/api/signUp/clist',
type:'get',
data:id,
dataType:'json',
async:true,
success:function(clist){
$("#select_city").empty();// jq写法 清楚地区下拉框的所有内容,然后拼接上从后台取出来的数据
$("<option value=''>请选择</option>").appendTo("#select_city");
for(var i=0;i<clist.length;i++){//获取clist里面的数据,拼接到select上
$("#select_city").append("<option value='"+clist[i].city_name+"'>"+clist[i].city_name+"</option>");
}
},
});
$.ajax({
url:'http://localhost:8080/fullstack/api/signUp/slist',
data:id,
type:'get',
dataType:'json',
async:true,
success:function(slist){
$("#select_school").empty();//清除下拉列表的内容
$("<option value=''>请选择</option>").appendTo("#select_school");
for(var i=0;i<slist.length;i++){
$("#select_school").append("<option value='"+slist[i].school_name+"'>"+slist[i].school_name+"</option>");
}
},
});
});
});
</script>

点击查看更多内容
11人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消