省,市,县三级联动
发布日期:2021-10-12 20:07:54 浏览次数:6 分类:技术文章

本文共 1279 字,大约阅读时间需要 4 分钟。

js 加载 获取省市县 

//页面加载时获取省的信息
$(function() {
getProvinces();
});
 //获取所有省份
function getProvinces(ele) {
  //获取省
$.getJSON("/user/system/getProvinces", function(data) {
$.each(data, function() {
var opt = $("").append(this.provinceName)
.attr("provinceId", this.provinceId);
opt.appendTo("#Province_add_select");
})
});
}
//下拉框改变时获取相应市的信息
 
 
 
function selectCitys(ele) {
var provinceId = $("#Province_add_select").find("option:selected")
.attr("provinceId");
   //根据省id获取对应的城市
$.getJSON("/user/system/getCity", {
provinceId : provinceId
}, function(data) {
$("#City_add_select").empty();
$.each(data, function() {
var opt = $("").append(this.cityName)
.attr("cityId", this.cityId);
opt.appendTo("#City_add_select");
})
})
}
//下拉框改变时获取相应区的信息
function selectCountys(ele) {
var cityId = $("#City_add_select").find("option:selected").attr(
"cityId");
  //根据市id获取相对应的区县
$.getJSON("/user/system/getArea", {
cityId : cityId
}, function(data) {
$("#County_add_select").empty();
$.each(data, function() {
var opt = $("").append(this.areaName);
opt.appendTo("#County_add_select");
})
})
}

html 

   
    














 

省市县数据库表

链接:https://pan.baidu.com/s/19UWT3ZVMngbzfxlc89-L6A 
提取码:3rpf 
 

 

 

转载地址:https://blog.csdn.net/qq_39772439/article/details/90236960 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:Java 多条数据提交,前台js如何传值,后台如何接参
下一篇:面试基础之线程

发表评论

最新留言

第一次来,支持一个
[***.119.156.56]2022年04月17日 05时27分32秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

最新文章