使用Ajax实现省市联动&&Bootstrap的基本使用

上节课我们已经讲了Ajax了,现在我们来使用Ajax来实现省市联动以及bootstrap的一些基本使用

目录

一.案例(使用Ajax实现省市联动)

二.Bootstrap的基本介绍

三.bootstrap——案例(使用Ajax以及Bootsrtap实现无刷新分页功能)


一.案例(使用Ajax实现省市联动)

Oracle数据库代码:

create sequence seq_region;
create sequence seq_goods;

--省表
create table bs_region
(
    id   number      NOT NULL PRIMARY KEY,
    name varchar(32) NOT NULL,
    rid  int         NOT NULL
);

--省
insert into bs_region
values (seq_region.nextval, '北京市', 0);
insert into bs_region
values (seq_region.nextval, '天津市', 0);
insert into bs_region
values (seq_region.nextval, '上海市', 0);
insert into bs_region
values (seq_region.nextval, '重庆市', 0);
insert into bs_region
values (seq_region.nextval, '河北省', 0);
insert into bs_region
values (seq_region.nextval, '山西省', 0);
insert into bs_region
values (seq_region.nextval, '台湾省', 0);
insert into bs_region
values (seq_region.nextval, '辽宁省', 0);
insert into bs_region
values (seq_region.nextval, '吉林省', 0);
insert into bs_region
values (seq_region.nextval, '黑龙江省', 0);
insert into bs_region
values (seq_region.nextval, '江苏省', 0);
insert into bs_region
values (seq_region.nextval, '浙江省', 0);
insert into bs_region
values (seq_region.nextval, '安徽省', 0);
insert into bs_region
values (seq_region.nextval, '福建省', 0);
insert into bs_region
values (seq_region.nextval, '江西省', 0);
insert into bs_region
values (seq_region.nextval, '山东省', 0);
insert into bs_region
values (seq_region.nextval, '河南省', 0);
insert into bs_region
values (seq_region.nextval, '湖北省', 0);
insert into bs_region
values (seq_region.nextval, '湖南省', 0);
insert into bs_region
values (seq_region.nextval, '广东省', 0);
insert into bs_region
values (seq_region.nextval, '甘肃省', 0);
insert into bs_region
values (seq_region.nextval, '四川省', 0);
insert into bs_region
values (seq_region.nextval, '贵州省', 0);
insert into bs_region
values (seq_region.nextval, '海南省', 0);
insert into bs_region
values (seq_region.nextval, '云南省', 0);
insert into bs_region
values (seq_region.nextval, '青海省', 0);
insert into bs_region
values (seq_region.nextval, '陕西省', 0);
insert into bs_region
values (seq_region.nextval, '广西壮族自治区', 0);
insert into bs_region
values (seq_region.nextval, '西藏自治区', 0);
insert into bs_region
values (seq_region.nextval, '宁夏回族自治区', 0);
insert into bs_region
values (seq_region.nextval, '新疆维吾尔自治区', 0);
insert into bs_region
values (seq_region.nextval, '内蒙古自治区', 0);
insert into bs_region
values (seq_region.nextval, '澳门特别行政区', 0);
insert into bs_region
values (seq_region.nextval, '香港特别行政区', 0);

--插入各个省的城市数据
--4个直辖市  ;
insert into bs_region
values (seq_region.nextval, '北京市', 1);
insert into bs_region
values (seq_region.nextval, '天津市', 2);
insert into bs_region
values (seq_region.nextval, '上海市', 3);
insert into bs_region
values (seq_region.nextval, '重庆市', 4);

select * from bs_region

--5河北省(2005年辖:11个地级市,36个市辖区、22个县级市、108个县、6个自治县)  ;
insert into bs_region
values (seq_region.nextval, '石家庄市', 5);
insert into bs_region
values (seq_region.nextval, '唐山市', 5);
insert into bs_region
values (seq_region.nextval, '秦皇岛市', 5);
insert into bs_region
values (seq_region.nextval, '邯郸市', 5);
insert into bs_region
values (seq_region.nextval, '邢台市', 5);
insert into bs_region
values (seq_region.nextval, '保定市', 5);
insert into bs_region
values (seq_region.nextval, '张家口市', 5);
insert into bs_region
values (seq_region.nextval, '承德市', 5);
insert into bs_region
values (seq_region.nextval, '沧州市', 5);
insert into bs_region
values (seq_region.nextval, '廊坊市', 5);
insert into bs_region
values (seq_region.nextval, '衡水市', 5);
--6山西省11个城市  ;
insert into bs_region
values (seq_region.nextval, '太原市', 6);
insert into bs_region
values (seq_region.nextval, '大同市', 6);
insert into bs_region
values (seq_region.nextval, '阳泉市', 6);
insert into bs_region
values (seq_region.nextval, '长治市', 6);
insert into bs_region
values (seq_region.nextval, '晋城市', 6);
insert into bs_region
values (seq_region.nextval, '朔州市', 6);
insert into bs_region
values (seq_region.nextval, '晋中市', 6);
insert into bs_region
values (seq_region.nextval, '运城市', 6);
insert into bs_region
values (seq_region.nextval, '忻州市', 6);
insert into bs_region
values (seq_region.nextval, '临汾市', 6);
insert into bs_region
values (seq_region.nextval, '吕梁市', 6);

insert into bs_region
values (seq_region.nextval, '台北市', 7);
insert into bs_region
values (seq_region.nextval, '高雄市', 7);
insert into bs_region
values (seq_region.nextval, '基隆市', 7);
insert into bs_region
values (seq_region.nextval, '台中市', 7);
insert into bs_region
values (seq_region.nextval, '台南市', 7);
insert into bs_region
values (seq_region.nextval, '新竹市', 7);
insert into bs_region
values (seq_region.nextval, '嘉义市', 7);
insert into bs_region
values (seq_region.nextval, '台北县', 7);
insert into bs_region
values (seq_region.nextval, '宜兰县', 7);
insert into bs_region
values (seq_region.nextval, '桃园县', 7);
insert into bs_region
values (seq_region.nextval, '新竹县', 7);
insert into bs_region
values (seq_region.nextval, '苗栗县', 7);
insert into bs_region
values (seq_region.nextval, '台中县', 7);
insert into bs_region
values (seq_region.nextval, '彰化县', 7);
insert into bs_region
values (seq_region.nextval, '南投县', 7);
insert into bs_region
values (seq_region.nextval, '云林县', 7);
insert into bs_region
values (seq_region.nextval, '嘉义县', 7);
insert into bs_region
values (seq_region.nextval, '台南县', 7);
insert into bs_region
values (seq_region.nextval, '高雄县', 7);
insert into bs_region
values (seq_region.nextval, '屏东县', 7);
insert into bs_region
values (seq_region.nextval, '澎湖县', 7);
insert into bs_region
values (seq_region.nextval, '台东县', 7);
insert into bs_region
values (seq_region.nextval, '花莲县', 7);

insert into bs_region
values (seq_region.nextval, '沈阳市', 8);
insert into bs_region
values (seq_region.nextval, '大连市', 8);
insert into bs_region
values (seq_region.nextval, '鞍山市', 8);
insert into bs_region
values (seq_region.nextval, '抚顺市', 8);
insert into bs_region
values (seq_region.nextval, '本溪市', 8);
insert into bs_region
values (seq_region.nextval, '丹东市', 8);
insert into bs_region
values (seq_region.nextval, '锦州市', 8);
insert into bs_region
values (seq_region.nextval, '营口市', 8);
insert into bs_region
values (seq_region.nextval, '阜新市', 8);
insert into bs_region
values (seq_region.nextval, '辽阳市', 8);
insert into bs_region
values (seq_region.nextval, '盘锦市', 8);
insert into bs_region
values (seq_region.nextval, '铁岭市', 8);
insert into bs_region
values (seq_region.nextval, '朝阳市', 8);
insert into bs_region
values (seq_region.nextval, '葫芦岛市', 8);

insert into bs_region
values (seq_region.nextval, '长春市', 9);
insert into bs_region
values (seq_region.nextval, '吉林市', 9);
insert into bs_region
values (seq_region.nextval, '四平市', 9);
insert into bs_region
values (seq_region.nextval, '辽源市', 9);
insert into bs_region
values (seq_region.nextval, '通化市', 9);
insert into bs_region
values (seq_region.nextval, '白山市', 9);
insert into bs_region
values (seq_region.nextval, '松原市', 9);
insert into bs_region
values (seq_region.nextval, '白城市', 9);
insert into bs_region
values (seq_region.nextval, '延边朝鲜族自治州', 9);

insert into bs_region
values (seq_region.nextval, '哈尔滨市', 10);
insert into bs_region
values (seq_region.nextval, '齐齐哈尔市', 10);
insert into bs_region
values (seq_region.nextval, '鹤 岗 市', 10);
insert into bs_region
values (seq_region.nextval, '双鸭山市', 10);
insert into bs_region
values (seq_region.nextval, '鸡 西 市', 10);
insert into bs_region
values (seq_region.nextval, '大 庆 市', 10);
insert into bs_region
values (seq_region.nextval, '伊 春 市', 10);
insert into bs_region
values (seq_region.nextval, '牡丹江市', 10);
insert into bs_region
values (seq_region.nextval, '佳木斯市', 10);
insert into bs_region
values (seq_region.nextval, '七台河市', 10);
insert into bs_region
values (seq_region.nextval, '黑 河 市', 10);
insert into bs_region
values (seq_region.nextval, '绥 化 市', 10);
insert into bs_region
values (seq_region.nextval, '大兴安岭地区', 10);

insert into bs_region
values (seq_region.nextval, '南京市', 11);
insert into bs_region
values (seq_region.nextval, '无锡市', 11);
insert into bs_region
values (seq_region.nextval, '徐州市', 11);
insert into bs_region
values (seq_region.nextval, '常州市', 11);
insert into bs_region
values (seq_region.nextval, '苏州市', 11);
insert into bs_region
values (seq_region.nextval, '南通市', 11);
insert into bs_region
values (seq_region.nextval, '连云港市', 11);
insert into bs_region
values (seq_region.nextval, '淮安市', 11);
insert into bs_region
values (seq_region.nextval, '盐城市', 11);
insert into bs_region
values (seq_region.nextval, '扬州市', 11);
insert into bs_region
values (seq_region.nextval, '镇江市', 11);
insert into bs_region
values (seq_region.nextval, '泰州市', 11);
insert into bs_region
values (seq_region.nextval, '宿迁市', 11);

insert into bs_region
values (seq_region.nextval, '杭州市', 12);
insert into bs_region
values (seq_region.nextval, '宁波市', 12);
insert into bs_region
values (seq_region.nextval, '温州市', 12);
insert into bs_region
values (seq_region.nextval, '嘉兴市', 12);
insert into bs_region
values (seq_region.nextval, '湖州市', 12);
insert into bs_region
values (seq_region.nextval, '绍兴市', 12);
insert into bs_region
values (seq_region.nextval, '金华市', 12);
insert into bs_region
values (seq_region.nextval, '衢州市', 12);
insert into bs_region
values (seq_region.nextval, '舟山市', 12);
insert into bs_region
values (seq_region.nextval, '台州市', 12);
insert into bs_region
values (seq_region.nextval, '丽水市', 12);

insert into bs_region
values (seq_region.nextval, '合肥市', 13);
insert into bs_region
values (seq_region.nextval, '芜湖市', 13);
insert into bs_region
values (seq_region.nextval, '蚌埠市', 13);
insert into bs_region
values (seq_region.nextval, '淮南市', 13);
insert into bs_region
values (seq_region.nextval, '马鞍山市', 13);
insert into bs_region
values (seq_region.nextval, '淮北市', 13);
insert into bs_region
values (seq_region.nextval, '铜陵市', 13);
insert into bs_region
values (seq_region.nextval, '安庆市', 13);
insert into bs_region
values (seq_region.nextval, '黄山市', 13);
insert into bs_region
values (seq_region.nextval, '滁州市', 13);
insert into bs_region
values (seq_region.nextval, '阜阳市', 13);
insert into bs_region
values (seq_region.nextval, '宿州市', 13);
insert into bs_region
values (seq_region.nextval, '巢湖市', 13);
insert into bs_region
values (seq_region.nextval, '六安市', 13);
insert into bs_region
values (seq_region.nextval, '亳州市', 13);
insert into bs_region
values (seq_region.nextval, '池州市', 13);
insert into bs_region
values (seq_region.nextval, '宣城市', 13);

insert into bs_region
values (seq_region.nextval, '福州市', 14);
insert into bs_region
values (seq_region.nextval, '厦门市', 14);
insert into bs_region
values (seq_region.nextval, '莆田市', 14);
insert into bs_region
values (seq_region.nextval, '三明市', 14);
insert into bs_region
values (seq_region.nextval, '泉州市', 14);
insert into bs_region
values (seq_region.nextval, '漳州市', 14);
insert into bs_region
values (seq_region.nextval, '南平市', 14);
insert into bs_region
values (seq_region.nextval, '龙岩市', 14);
insert into bs_region
values (seq_region.nextval, '宁德市', 14);

insert into bs_region
values (seq_region.nextval, '南昌市', 15);
insert into bs_region
values (seq_region.nextval, '景德镇市', 15);
insert into bs_region
values (seq_region.nextval, '萍乡市', 15);
insert into bs_region
values (seq_region.nextval, '九江市', 15);
insert into bs_region
values (seq_region.nextval, '新余市', 15);
insert into bs_region
values (seq_region.nextval, '鹰潭市', 15);
insert into bs_region
values (seq_region.nextval, '赣州市', 15);
insert into bs_region
values (seq_region.nextval, '吉安市', 15);
insert into bs_region
values (seq_region.nextval, '宜春市', 15);
insert into bs_region
values (seq_region.nextval, '抚州市', 15);
insert into bs_region
values (seq_region.nextval, '上饶市', 15);

insert into bs_region
values (seq_region.nextval, '济南市', 16);
insert into bs_region
values (seq_region.nextval, '青岛市', 16);
insert into bs_region
values (seq_region.nextval, '淄博市', 16);
insert into bs_region
values (seq_region.nextval, '枣庄市', 16);
insert into bs_region
values (seq_region.nextval, '东营市', 16);
insert into bs_region
values (seq_region.nextval, '烟台市', 16);
insert into bs_region
values (seq_region.nextval, '潍坊市', 16);
insert into bs_region
values (seq_region.nextval, '济宁市', 16);
insert into bs_region
values (seq_region.nextval, '泰安市', 16);
insert into bs_region
values (seq_region.nextval, '威海市', 16);
insert into bs_region
values (seq_region.nextval, '日照市', 16);
insert into bs_region
values (seq_region.nextval, '莱芜市', 16);
insert into bs_region
values (seq_region.nextval, '临沂市', 16);
insert into bs_region
values (seq_region.nextval, '德州市', 16);
insert into bs_region
values (seq_region.nextval, '聊城市', 16);
insert into bs_region
values (seq_region.nextval, '滨州市', 16);
insert into bs_region
values (seq_region.nextval, '菏泽市', 16);

insert into bs_region
values (seq_region.nextval, '郑州市', 17);
insert into bs_region
values (seq_region.nextval, '开封市', 17);
insert into bs_region
values (seq_region.nextval, '洛阳市', 17);
insert into bs_region
values (seq_region.nextval, '平顶山市', 17);
insert into bs_region
values (seq_region.nextval, '安阳市', 17);
insert into bs_region
values (seq_region.nextval, '鹤壁市', 17);
insert into bs_region
values (seq_region.nextval, '新乡市', 17);
insert into bs_region
values (seq_region.nextval, '焦作市', 17);
insert into bs_region
values (seq_region.nextval, '濮阳市', 17);
insert into bs_region
values (seq_region.nextval, '许昌市', 17);
insert into bs_region
values (seq_region.nextval, '漯河市', 17);
insert into bs_region
values (seq_region.nextval, '三门峡市', 17);
insert into bs_region
values (seq_region.nextval, '南阳市', 17);
insert into bs_region
values (seq_region.nextval, '商丘市', 17);
insert into bs_region
values (seq_region.nextval, '信阳市', 17);
insert into bs_region
values (seq_region.nextval, '周口市', 17);
insert into bs_region
values (seq_region.nextval, '驻马店市', 17);
insert into bs_region
values (seq_region.nextval, '济源市', 17);

insert into bs_region
values (seq_region.nextval, '武汉市', 18);
insert into bs_region
values (seq_region.nextval, '黄石市', 18);
insert into bs_region
values (seq_region.nextval, '十堰市', 18);
insert into bs_region
values (seq_region.nextval, '荆州市', 18);
insert into bs_region
values (seq_region.nextval, '宜昌市', 18);
insert into bs_region
values (seq_region.nextval, '襄樊市', 18);
insert into bs_region
values (seq_region.nextval, '鄂州市', 18);
insert into bs_region
values (seq_region.nextval, '荆门市', 18);
insert into bs_region
values (seq_region.nextval, '孝感市', 18);
insert into bs_region
values (seq_region.nextval, '黄冈市', 18);
insert into bs_region
values (seq_region.nextval, '咸宁市', 18);
insert into bs_region
values (seq_region.nextval, '随州市', 18);
insert into bs_region
values (seq_region.nextval, '仙桃市', 18);
insert into bs_region
values (seq_region.nextval, '天门市', 18);
insert into bs_region
values (seq_region.nextval, '潜江市', 18);
insert into bs_region
values (seq_region.nextval, '神农架林区', 18);
insert into bs_region
values (seq_region.nextval, '恩施土家族苗族自治州', 18);

insert into bs_region
values (seq_region.nextval, '长沙市', 19);
insert into bs_region
values (seq_region.nextval, '株洲市', 19);
insert into bs_region
values (seq_region.nextval, '湘潭市', 19);
insert into bs_region
values (seq_region.nextval, '衡阳市', 19);
insert into bs_region
values (seq_region.nextval, '邵阳市', 19);
insert into bs_region
values (seq_region.nextval, '岳阳市', 19);
insert into bs_region
values (seq_region.nextval, '常德市', 19);
insert into bs_region
values (seq_region.nextval, '张家界市', 19);
insert into bs_region
values (seq_region.nextval, '益阳市', 19);
insert into bs_region
values (seq_region.nextval, '郴州市', 19);
insert into bs_region
values (seq_region.nextval, '永州市', 19);
insert into bs_region
values (seq_region.nextval, '怀化市', 19);
insert into bs_region
values (seq_region.nextval, '娄底市', 19);
insert into bs_region
values (seq_region.nextval, '湘西土家族苗族自治州', 19);

insert into bs_region
values (seq_region.nextval, '广州市', 20);
insert into bs_region
values (seq_region.nextval, '深圳市', 20);
insert into bs_region
values (seq_region.nextval, '珠海市', 20);
insert into bs_region
values (seq_region.nextval, '汕头市', 20);
insert into bs_region
values (seq_region.nextval, '韶关市', 20);
insert into bs_region
values (seq_region.nextval, '佛山市', 20);
insert into bs_region
values (seq_region.nextval, '江门市', 20);
insert into bs_region
values (seq_region.nextval, '湛江市', 20);
insert into bs_region
values (seq_region.nextval, '茂名市', 20);
insert into bs_region
values (seq_region.nextval, '肇庆市', 20);
insert into bs_region
values (seq_region.nextval, '惠州市', 20);
insert into bs_region
values (seq_region.nextval, '梅州市', 20);
insert into bs_region
values (seq_region.nextval, '汕尾市', 20);
insert into bs_region
values (seq_region.nextval, '河源市', 20);
insert into bs_region
values (seq_region.nextval, '阳江市', 20);
insert into bs_region
values (seq_region.nextval, '清远市', 20);
insert into bs_region
values (seq_region.nextval, '东莞市', 20);
insert into bs_region
values (seq_region.nextval, '中山市', 20);
insert into bs_region
values (seq_region.nextval, '潮州市', 20);
insert into bs_region
values (seq_region.nextval, '揭阳市', 20);
insert into bs_region
values (seq_region.nextval, '云浮市', 20);

insert into bs_region
values (seq_region.nextval, '兰州市', 21);
insert into bs_region
values (seq_region.nextval, '金昌市', 21);
insert into bs_region
values (seq_region.nextval, '白银市', 21);
insert into bs_region
values (seq_region.nextval, '天水市', 21);
insert into bs_region
values (seq_region.nextval, '嘉峪关市', 21);
insert into bs_region
values (seq_region.nextval, '武威市', 21);
insert into bs_region
values (seq_region.nextval, '张掖市', 21);
insert into bs_region
values (seq_region.nextval, '平凉市', 21);
insert into bs_region
values (seq_region.nextval, '酒泉市', 21);
insert into bs_region
values (seq_region.nextval, '庆阳市', 21);
insert into bs_region
values (seq_region.nextval, '定西市', 21);
insert into bs_region
values (seq_region.nextval, '陇南市', 21);
insert into bs_region
values (seq_region.nextval, '临夏回族自治州', 21);
insert into bs_region
values (seq_region.nextval, '甘南藏族自治州', 21);

insert into bs_region
values (seq_region.nextval, '成都市', 22);
insert into bs_region
values (seq_region.nextval, '自贡市', 22);
insert into bs_region
values (seq_region.nextval, '攀枝花市', 22);
insert into bs_region
values (seq_region.nextval, '泸州市', 22);
insert into bs_region
values (seq_region.nextval, '德阳市', 22);
insert into bs_region
values (seq_region.nextval, '绵阳市', 22);
insert into bs_region
values (seq_region.nextval, '广元市', 22);
insert into bs_region
values (seq_region.nextval, '遂宁市', 22);
insert into bs_region
values (seq_region.nextval, '内江市', 22);
insert into bs_region
values (seq_region.nextval, '乐山市', 22);
insert into bs_region
values (seq_region.nextval, '南充市', 22);
insert into bs_region
values (seq_region.nextval, '眉山市', 22);
insert into bs_region
values (seq_region.nextval, '宜宾市', 22);
insert into bs_region
values (seq_region.nextval, '广安市', 22);
insert into bs_region
values (seq_region.nextval, '达州市', 22);
insert into bs_region
values (seq_region.nextval, '雅安市', 22);
insert into bs_region
values (seq_region.nextval, '巴中市', 22);
insert into bs_region
values (seq_region.nextval, '资阳市', 22);
insert into bs_region
values (seq_region.nextval, '阿坝藏族羌族自治州', 22);
insert into bs_region
values (seq_region.nextval, '甘孜藏族自治州', 22);
insert into bs_region
values (seq_region.nextval, '凉山彝族自治州', 22);

insert into bs_region
values (seq_region.nextval, '贵阳市', 23);
insert into bs_region
values (seq_region.nextval, '六盘水市', 23);
insert into bs_region
values (seq_region.nextval, '遵义市', 23);
insert into bs_region
values (seq_region.nextval, '安顺市', 23);
insert into bs_region
values (seq_region.nextval, '铜仁地区', 23);
insert into bs_region
values (seq_region.nextval, '毕节地区', 23);
insert into bs_region
values (seq_region.nextval, '黔西南布依族苗族自治州', 23);
insert into bs_region
values (seq_region.nextval, '黔东南苗族侗族自治州', 23);
insert into bs_region
values (seq_region.nextval, '黔南布依族苗族自治州', 23);

insert into bs_region
values (seq_region.nextval, '海口市', 24);
insert into bs_region
values (seq_region.nextval, '三亚市', 24);
insert into bs_region
values (seq_region.nextval, '五指山市', 24);
insert into bs_region
values (seq_region.nextval, '琼海市', 24);
insert into bs_region
values (seq_region.nextval, '儋州市', 24);
insert into bs_region
values (seq_region.nextval, '文昌市', 24);
insert into bs_region
values (seq_region.nextval, '万宁市', 24);
insert into bs_region
values (seq_region.nextval, '东方市', 24);
insert into bs_region
values (seq_region.nextval, '澄迈县', 24);
insert into bs_region
values (seq_region.nextval, '定安县', 24);
insert into bs_region
values (seq_region.nextval, '屯昌县', 24);
insert into bs_region
values (seq_region.nextval, '临高县', 24);
insert into bs_region
values (seq_region.nextval, '白沙黎族自治县', 24);
insert into bs_region
values (seq_region.nextval, '昌江黎族自治县', 24);
insert into bs_region
values (seq_region.nextval, '乐东黎族自治县', 24);
insert into bs_region
values (seq_region.nextval, '陵水黎族自治县', 24);
insert into bs_region
values (seq_region.nextval, '保亭黎族苗族自治县', 24);
insert into bs_region
values (seq_region.nextval, '琼中黎族苗族自治县', 24);

insert into bs_region
values (seq_region.nextval, '昆明市', 25);
insert into bs_region
values (seq_region.nextval, '曲靖市', 25);
insert into bs_region
values (seq_region.nextval, '玉溪市', 25);
insert into bs_region
values (seq_region.nextval, '保山市', 25);
insert into bs_region
values (seq_region.nextval, '昭通市', 25);
insert into bs_region
values (seq_region.nextval, '丽江市', 25);
insert into bs_region
values (seq_region.nextval, '思茅市', 25);
insert into bs_region
values (seq_region.nextval, '临沧市', 25);
insert into bs_region
values (seq_region.nextval, '文山壮族苗族自治州', 25);
insert into bs_region
values (seq_region.nextval, '红河哈尼族彝族自治州', 25);
insert into bs_region
values (seq_region.nextval, '西双版纳傣族自治州', 25);
insert into bs_region
values (seq_region.nextval, '楚雄彝族自治州', 25);
insert into bs_region
values (seq_region.nextval, '大理白族自治州', 25);
insert into bs_region
values (seq_region.nextval, '德宏傣族景颇族自治州', 25);
insert into bs_region
values (seq_region.nextval, '怒江傈傈族自治州', 25);
insert into bs_region
values (seq_region.nextval, '迪庆藏族自治州', 25);

insert into bs_region
values (seq_region.nextval, '西宁市', 26);
insert into bs_region
values (seq_region.nextval, '海东地区', 26);
insert into bs_region
values (seq_region.nextval, '海北藏族自治州', 26);
insert into bs_region
values (seq_region.nextval, '黄南藏族自治州', 26);
insert into bs_region
values (seq_region.nextval, '海南藏族自治州', 26);
insert into bs_region
values (seq_region.nextval, '果洛藏族自治州', 26);
insert into bs_region
values (seq_region.nextval, '玉树藏族自治州', 26);
insert into bs_region
values (seq_region.nextval, '海西蒙古族藏族自治州', 26);

insert into bs_region
values (seq_region.nextval, '西安市', 27);
insert into bs_region
values (seq_region.nextval, '铜川市', 27);
insert into bs_region
values (seq_region.nextval, '宝鸡市', 27);
insert into bs_region
values (seq_region.nextval, '咸阳市', 27);
insert into bs_region
values (seq_region.nextval, '渭南市', 27);
insert into bs_region
values (seq_region.nextval, '延安市', 27);
insert into bs_region
values (seq_region.nextval, '汉中市', 27);
insert into bs_region
values (seq_region.nextval, '榆林市', 27);
insert into bs_region
values (seq_region.nextval, '安康市', 27);
insert into bs_region
values (seq_region.nextval, '商洛市', 27);

insert into bs_region
values (seq_region.nextval, '南宁市', 28);
insert into bs_region
values (seq_region.nextval, '柳州市', 28);
insert into bs_region
values (seq_region.nextval, '桂林市', 28);
insert into bs_region
values (seq_region.nextval, '梧州市', 28);
insert into bs_region
values (seq_region.nextval, '北海市', 28);
insert into bs_region
values (seq_region.nextval, '防城港市', 28);
insert into bs_region
values (seq_region.nextval, '钦州市', 28);
insert into bs_region
values (seq_region.nextval, '贵港市', 28);
insert into bs_region
values (seq_region.nextval, '玉林市', 28);
insert into bs_region
values (seq_region.nextval, '百色市', 28);
insert into bs_region
values (seq_region.nextval, '贺州市', 28);
insert into bs_region
values (seq_region.nextval, '河池市', 28);
insert into bs_region
values (seq_region.nextval, '来宾市', 28);
insert into bs_region
values (seq_region.nextval, '崇左市', 28);

insert into bs_region
values (seq_region.nextval, '拉萨市', 29);
insert into bs_region
values (seq_region.nextval, '那曲地区', 29);
insert into bs_region
values (seq_region.nextval, '昌都地区', 29);
insert into bs_region
values (seq_region.nextval, '山南地区', 29);
insert into bs_region
values (seq_region.nextval, '日喀则地区', 29);
insert into bs_region
values (seq_region.nextval, '阿里地区', 29);
insert into bs_region
values (seq_region.nextval, '林芝地区', 29);
--30宁夏回族自治区  ;
insert into bs_region
values (seq_region.nextval, '银川市', 30);
insert into bs_region
values (seq_region.nextval, '石嘴山市', 30);
insert into bs_region
values (seq_region.nextval, '吴忠市', 30);
insert into bs_region
values (seq_region.nextval, '固原市', 30);
insert into bs_region
values (seq_region.nextval, '中卫市', 30);

insert into bs_region
values (seq_region.nextval, '乌鲁木齐市', 31);
insert into bs_region
values (seq_region.nextval, '克拉玛依市', 31);
insert into bs_region
values (seq_region.nextval, '石河子市 ', 31);
insert into bs_region
values (seq_region.nextval, '阿拉尔市', 31);
insert into bs_region
values (seq_region.nextval, '图木舒克市', 31);
insert into bs_region
values (seq_region.nextval, '五家渠市', 31);
insert into bs_region
values (seq_region.nextval, '吐鲁番市', 31);
insert into bs_region
values (seq_region.nextval, '阿克苏市', 31);
insert into bs_region
values (seq_region.nextval, '喀什市', 31);
insert into bs_region
values (seq_region.nextval, '哈密市', 31);
insert into bs_region
values (seq_region.nextval, '和田市', 31);
insert into bs_region
values (seq_region.nextval, '阿图什市', 31);
insert into bs_region
values (seq_region.nextval, '库尔勒市', 31);
insert into bs_region
values (seq_region.nextval, '昌吉市 ', 31);
insert into bs_region
values (seq_region.nextval, '阜康市', 31);
insert into bs_region
values (seq_region.nextval, '米泉市', 31);
insert into bs_region
values (seq_region.nextval, '博乐市', 31);
insert into bs_region
values (seq_region.nextval, '伊宁市', 31);
insert into bs_region
values (seq_region.nextval, '奎屯市', 31);
insert into bs_region
values (seq_region.nextval, '塔城市', 31);
insert into bs_region
values (seq_region.nextval, '乌苏市', 31);
insert into bs_region
values (seq_region.nextval, '阿勒泰市', 31);

insert into bs_region
values (seq_region.nextval, '呼和浩特市', 32);
insert into bs_region
values (seq_region.nextval, '包头市', 32);
insert into bs_region
values (seq_region.nextval, '乌海市', 32);
insert into bs_region
values (seq_region.nextval, '赤峰市', 32);
insert into bs_region
values (seq_region.nextval, '通辽市', 32);
insert into bs_region
values (seq_region.nextval, '鄂尔多斯市', 32);
insert into bs_region
values (seq_region.nextval, '呼伦贝尔市', 32);
insert into bs_region
values (seq_region.nextval, '巴彦淖尔市', 32);
insert into bs_region
values (seq_region.nextval, '乌兰察布市', 32);
insert into bs_region
values (seq_region.nextval, '锡林郭勒盟', 32);
insert into bs_region
values (seq_region.nextval, '兴安盟', 32);
insert into bs_region
values (seq_region.nextval, '阿拉善盟', 32);

insert into bs_region
values (seq_region.nextval, '澳门特别行政区', 33);

insert into bs_region
values (seq_region.nextval, '香港特别行政区', 34);

commit;

 实体类代码

🍍🍍 bolRegion (com.zking.pojo)

package com.zking.pojo;

public class Region {

	private Integer id;
	private String name;
	private Integer rid;
	
	public Region() {
		
	}

	public Region(Integer id, String name, Integer rid) {
		super();
		this.id = id;
		this.name = name;
		this.rid = rid;
	}

	public Integer getId() {
		return id;
	}

	public void setId(Integer id) {
		this.id = id;
	}

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public Integer getRid() {
		return rid;
	}

	public void setRid(Integer rid) {
		this.rid = rid;
	}

	@Override
	public String toString() {
		return "Region [id=" + id + ", name=" + name + ", rid=" + rid + "]";
	}
	
	
	
}

数据库访问层

🍊🍊 IRegionDao(com.zking.dao)

package com.zking.dao;

import java.util.List;

import com.zking.pojo.Region;

public interface IRegionDao {

	//根据id进行查询
	List<Region> list(int rid);
	

}

🍒🍒 RegionDaoImpl(com.zking.daoimpl)

package com.zking.daoimpl;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;

import com.zking.dao.IRegionDao;
import com.zking.pojo.Region;
import com.zking.util.DBHelper;

public class RegionDaoImpl implements IRegionDao{

	private Connection con;
	private PreparedStatement ps;
	private ResultSet rs;

	//根据id进行查询
	public List<Region> list(int rid) {
		List<Region> list=new ArrayList<Region>();
		try {
			con=DBHelper.getCon();
			 ps=con.prepareStatement("select * from BS_REGION  where rid=?");
			 ps.setInt(1,rid);
			 rs=ps.executeQuery();
			 while(rs.next()) {
				 Region r=new Region();
				 r.setId(rs.getInt(1));
				 r.setName(rs.getString(2));
				 r.setRid(rs.getInt(3));
				 list.add(r);
			 }
		} catch (Exception e) {
			e.printStackTrace();
		}finally {
			DBHelper.getClose(con, ps, rs);
		}
		
		return list;
	}
	
	
	
}

业务逻辑层

🍻🍻IRegionBiz (com.zking.biz)

package com.zking.biz;

import java.util.List;

import com.zking.pojo.Region;

public interface IRegionBiz {
	
	List<Region> list(int rid);
	

}

😜😜RegionBizImpl(com.zking.bizimpl)

package com.zking.bizimpl;

import java.util.List;

import com.zking.biz.IRegionBiz;
import com.zking.dao.IRegionDao;
import com.zking.daoimpl.RegionDaoImpl;
import com.zking.pojo.Region;

public class RegionBizImpl implements IRegionBiz{
 
	IRegionDao dao=new RegionDaoImpl();
	
	public List<Region> list(int rid) {
	   return dao.list(rid);
	}	
	
}

前端代码

   🌊 🌊  province(jsp)

<%--
  User: hgh
  Date: 2022/4/30
  Time: 14:16
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<select id="province" onchange="changeCity()"></select>
<select id="city"></select>
<script>
    let province=$("#province")
    let city=$("#city")

    function changeCity(){
        $.get('region.do',{rid:province.val() },(resp)=>{
            //清空原来的内容
            city.empty()
            //遍历数组  循环添加内容
            for(let r of resp){
                city.append("<option value='"+r.id+"'>"+r.name+"</option>")
            }
        },"json")
    }

    //jquery的加载事件
    $(()=>{
        //显示省份
        $.get('region.do',{rid:0},(resp)=>{
            //清空原来的内容
            province.empty()
            //遍历数组  循环添加内容
            for(let r of resp){
                province.append("<option value='"+r.id+"'>"+r.name+"</option>")
            }
            //省份遍历成功了
            //接下来遍历城市
            changeCity()
        },"json")
    })
</script>
</body>
</html>

  过滤器

  🍉 🍉  RegionServlet(com.zking.servlet)

package com.zking.servlet;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.fasterxml.jackson.databind.ObjectMapper;
import com.zking.biz.IRegionBiz;
import com.zking.bizimpl.RegionBizImpl;
import com.zking.pojo.Region;

/**
 * 
 * @author zjjt
 *省市联动的操作过滤器
 */
@WebServlet("/region.do")
public class RegionServlet extends HttpServlet{

	private IRegionBiz biz=new RegionBizImpl();
	private ObjectMapper mapper=new ObjectMapper();
	
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		doPost(req, resp);
	}
	

	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		//先拿到rid
		Integer rid=Integer.parseInt(req.getParameter("rid"));
		
		//根据rid查询对应的结果
		List<Region> list=biz.list(rid);
		//设置编码
		resp.setCharacterEncoding("utf-8");
		//通过响应丢出去
		PrintWriter out=resp.getWriter();
		
		//应该不是普通字符,是json字符串
	    String json=mapper.writeValueAsString(list);
		out.println(json);
	}
	
}

二.Bootstrap的基本介绍

  •  bootstrap是什么?

Bootstrap是一个用于快速开发Web应用程序和网站的前端框架,是基于html和JavaScript、css三者开发的框架,主要用于响应式网站上的结构和布局

  • bootstrap的历史

Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的

Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品

 为什么使用 Bootstrap?

  • 移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式。
  • 浏览器支持:所有的主流浏览器都支持 Bootstrap。
  • 容易上手:只要您具备 HTML 和 CSS 的基础知识,您就可以开始学习 Bootstrap。
  • 响应式设计:Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机。
  • 它为开发人员创建接口提供了一个简洁统一的解决方案。
  • 它包含了功能强大的内置组件,易于定制。

  • 它还提供了基于 Web 的定制。

  • 它是开源的。

 

下面这个主界是bootstrap的最新版:

 

三.bootstrap——案例(使用Ajax以及Bootsrtap实现无刷新分页功能

🍈🍈1.准备工作:

将下载好的bootstrap压缩包压缩,然后再把压缩好的文件夹复制到web项目中

 🍎🍎2.进行导包操作

<!-- 必需加这个 必须的 meta 标签 -->
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <!-- Bootstrap 的 CSS 文件 -->
<link href="bootstrap-5.0.0-beta3-dist/css/bootstrap.css" rel="stylesheet" integrity="sha384-rTTiRUKnSWaDu2FjhzWFl8/JuUZMlplyWE/djenb2LoKqkgLGfEGfSrL7XDLoB1M" crossorigin="anonymous">
<!-- 导入js -->
<script  src="bootstrap-5.0.0-beta3-dist/js/bootstrap.js"></script>

🍋🍋3.Oracle代码

create table bs_GOODS
(
    ID       NUMBER                                      not null primary key,
    NAME     VARCHAR2(20)                                not null,
    DESCRIBE VARCHAR2(100) default '此商品暂时没有介绍'           not null,
    PRICE    NUMBER                                      not null,
    stock    number        default 0                     not null,
    cover    varchar2(200) default '/images/default.jpg' not null
);
 
comment on table bs_GOODS is '商品表';
comment on column bs_GOODS.ID is '商品编号';
comment on column bs_GOODS.NAME is '商品名称';
comment on column bs_GOODS.DESCRIBE is '商品描述';
comment on column bs_GOODS.PRICE is '商品价格';
comment on column bs_GOODS.stock is '商品库存';
comment on column bs_GOODS.cover is '商品封面';
 
select seq_goods.nextval from dual;
 
insert into bs_GOODS
values (seq_goods.nextval, '珍珠奶茶', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '芋泥奶茶', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '柠檬水', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '葡萄养乐多', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '雪王咖啡', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '双炫弹筒', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '草莓大圣诞', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '蜜桃四季春', '冰冰好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '满杯百香果', '冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '红豆奶茶', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '西米奶茶', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '手打鲜橙', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '芝士奶盖绿茶', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '芝士奶盖红茶', '冰冰很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '黄桃大圣诞', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '招牌烧仙草', '很好喝', 99, 100,'a');
into bs_GOODS
values (seq_goods.nextval, '黄桃大圣诞', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '招牌烧仙草', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '巧克力大圣诞', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '招牌豆花', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '摩天脆脆', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '杨枝甘露', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '双拼摇摇奶昔', '很好喝', 99, 100,'a');
insert into bs_GOODS
values (seq_goods.nextval, '柠檬红茶', '很好喝', 99, 100,'a');
 
commit;

实体类代码:

🍟🍟Goods(com.zking.pojo)

package com.pojo;
/**
 * 商品实体类
 */
public class Goods {
	    private Integer id;
	    private String name;
	    private String describe;
	    private Integer price;
	    private Integer stock;//库存
	    private String cover;	    
	    public Goods() {
			// TODO Auto-generated constructor stub
		}
		public Goods(Integer id, String name, String describe, Integer price, Integer stock, String cover) {
			super();
			this.id = id;
			this.name = name;
			this.describe = describe;
			this.price = price;
			this.stock = stock;
			this.cover = cover;
		}
		public Integer getId() {
			return id;
		}
		public void setId(Integer id) {
			this.id = id;
		}
		public String getName() {
			return name;
		}
		public void setName(String name) {
			this.name = name;
		}
		public String getDescribe() {
			return describe;
		}
		public void setDescribe(String describe) {
			this.describe = describe;
		}
		public Integer getPrice() {
			return price;
		}
		public void setPrice(Integer price) {
			this.price = price;
		}
		public Integer getStock() {
			return stock;
		}
		public void setStock(Integer stock) {
			this.stock = stock;
		}
		public String getCover() {
			return cover;
		}
		public void setCover(String cover) {
			this.cover = cover;
		}
		@Override
		public String toString() {
			return "Goods [id=" + id + ", name=" + name + ", describe=" + describe + ", price=" + price + ", stock="
					+ stock + ", cover=" + cover + "]";
		}	    
}

🍇🍇GoodsVo(com.zking.vo)

package com.pojo;
import java.util.List;
/**
 * 用来放商品集合,和最大的页数
 */
public class GoodsVo {
	private List<Goods> list;
    private Integer total;
    public GoodsVo() {
		// TODO Auto-generated constructor stub
	}
	public GoodsVo(List<Goods> list, Integer total) {
		super();
		this.list = list;
		this.total = total;
	}
	public List<Goods> getList() {
		return list;
	}
	public void setList(List<Goods> list) {
		this.list = list;
	}
	public Integer getTotal() {
		return total;
	}
	public void setTotal(Integer total) {
		this.total = total;
	}
	@Override
	public String toString() {
		return "GoodsVo [list=" + list + ", total=" + total + "]";
	}   
}

   🍊🍊 IGoodsDao (com.zking.dao)

package com.dao;
import java.util.List;
import com.pojo.Goods;
public interface IGoodsDao {
	List<Goods> list(int page, int size);
    public int total();	
}

 🍄🍄GoodsDaoImpl(com.zking.daoimpl)

package com.dao.impl;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;
import com.dao.IGoodsDao;
import com.pojo.Goods;
import com.util.DBHelper;
 
public class GoodsDaoImpl implements IGoodsDao{	
	 private Connection con;
	 private PreparedStatement ps;
	 private ResultSet rs;
	  @Override
	    public List<Goods> list(int page, int size) {
	        List<Goods> list=new ArrayList<>();
	        int begin=(page-1)*size+1;
	        int end=page*size;
	        try {
	            con=DBHelper.getCon();
	            ps=con.prepareStatement("select * from (" +
	                    "    select a.*,ROWNUM rid from BS_GOODS a" +
	                    ") temp where rid between ? and ?");
	            ps.setInt(1,begin);
	            ps.setInt(2,end);
	            rs= ps.executeQuery();
	            while(rs.next()){
	                Goods goods=new Goods();
	                goods.setId(rs.getInt(1));
	                goods.setName(rs.getString(2));
	                goods.setDescribe(rs.getString(3));
	                goods.setPrice(rs.getInt(4));
	                goods.setStock(rs.getInt(5));
	                goods.setCover(rs.getString(6));
	                list.add(goods);
	            }
	            //System.out.println(list+"aa");
	        }catch (Exception e){
	            e.printStackTrace();
	        }finally {
	            DBHelper.close(con,ps,rs);
	        }
	        return list;
	    }
	@Override
	public int total() {
		try {
			con=DBHelper.getCon();
			ps=con.prepareStatement("select count(1) from bs_GOODS");
			rs=ps.executeQuery();
			if(rs.next()) {
				return rs.getInt(1);// !
			}
		} catch (Exception e) {
			e.printStackTrace();
		}finally {
			DBHelper.close(con, ps, rs);
		}
		return 0;
	}
}

 🌿🌿 IGoodsBiz(com.zking.biz)

package com.biz;
import java.util.List;
import com.pojo.Goods;
public interface IGoodsBiz {
	List<Goods> list(int page, int size);
    public int total();    
}

🍑🍑GoodsBizImpl(com.zking.bizimpl)

package com.biz.impl;
import java.util.List;
import com.biz.IGoodsBiz;
import com.dao.IGoodsDao;
import com.dao.impl.GoodsDaoImpl;
import com.pojo.Goods;
public class GoodsBizImpl implements IGoodsBiz{	
    IGoodsDao dao=new GoodsDaoImpl();
	@Override
	public List<Goods> list(int page, int size) {
		return dao.list(page, size);
	}
	@Override
	public int total() {
		return dao.total();
	}
}

  前端代码

 📖📖 index(jsp)

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Title</title>
    <script src="js/jquery-3.3.1.js"></script>
    <!-- Bootstrap CSS -->
    <link href="bootstrap-5.0.0-beta3-dist/css/bootstrap.css" rel="stylesheet">
    <!-- Bootstrap JS -->
    <script src="bootstrap-5.0.0-beta3-dist/js/bootstrap.js"></script>
    <style>
        .container {
            padding-top: 30px;
        }
    </style>
</head>
<body class="container">
<table class="table table-dark table-striped">
    <tr>
        <th>商品编号</th>
        <th>商品名字</th>
        <th>商品描述</th>
        <th>商品价格</th>
        <th>商品库存</th>
        <th>商品封面</th>
        <th>商品操作</th>
    </tr>
</table>
<nav>
    <ul id="pagination" class="pagination pagination-lg">
    </ul>
</nav>
<script>
    let page=1;//初始第一页
    let total=1;//初始化最大有一页
    function changePage(p){
        page=p;
        $.ajax({
            url: "goods.do",
            data: {page},
            type: "post",
            dataType: "json",
            success(resp) {
                let table = $("table")
                //清除表格数据
                table.find("tr").has("td").empty()
                //生成表格数据
                for (let g of resp.list) {
                    table.append(`<tr>
                            <td>`+g.id+`</td>
                            <td>`+g.name+`</td>
                            <td>`+g.describe+`</td>
                            <td>`+g.price+`</td>
                            <td>`+g.stock+`</td>
                            <td>`+g.cover+`</td>
                            <td></td>
                        </tr>
                        `)
                }
                //生成分页条 【只有总条数发生改变】
                if(total!==resp.total){
                    total=resp.total;
                    let pagination=$("#pagination")
                    pagination.empty();
                    for (let i = 1; i <= total; i++) {
                        pagination.append(
                            '<li class="page-item"><button onclick="changePage('+i+')" class="page-link">'+i+'</button></li>'
                        )
                    }
                }
                //选中对应的分页
                let item=$(".page-item").eq(page-1)
                //自己添加
                item.addClass("active")
                //兄弟移除
                item.siblings().removeClass("active")
            }
        })
    }
    //页面加载函数
    $(() => {
        changePage(1);
    })
</script>
</body>
</html>

   📃📃GoodsServlet(com.zking.servlet)

package com.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.biz.IGoodsBiz;
import com.biz.impl.GoodsBizImpl;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.pojo.Goods;
import com.pojo.GoodsVo;
 
@WebServlet("/goods.do")
public class GoodsServlet extends HttpServlet{
	
	private IGoodsBiz goodsBiz = new GoodsBizImpl();
	private ObjectMapper mapper = new ObjectMapper();
	
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		doPost(req, resp);
	}
	
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		//先拿到请求的页数和行数
        int size = 3;
        int page = 1;
        String obj = req.getParameter("page");
        if (obj != null) {
            page = Integer.parseInt(obj);
        }
        //拿到数据库的数据
        List<Goods> list = goodsBiz.list(page, size);
        //拿到数据库的总条数
        int total = goodsBiz.total();
        //根据size计算最大的页数
        total = (int) Math.ceil(total * 1.0 / size);
        //封装Vo对象
        GoodsVo gv = new GoodsVo(list, total);
        //然后通过响应丢出去
        resp.setCharacterEncoding("utf-8");
        PrintWriter out = resp.getWriter();
        //对象->json字符串
        out.println(mapper.writeValueAsString(gv));
	}	
}


今天的代码就到这里啦~咱们下期见!

今天也要记得微笑呀.

  • 5
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值