淘先锋技术网

首页 1 2 3 4 5 6 7

多级联动是在软件开发中经常碰到的问题,本文章与大家探讨三级联动的技术,使用jQuery对ajax技术的支持,使用$.post方法实现省市县三级联动,后台使用jsp的servlet技术,MySQL数据库,fastjson封装json数据,具体实现如下:

环境要求

序号 资源 说明
1 jQuery插件 ajax通讯基础
2 mysql数据库 存储省市县数据
3 jdk1.8+ 开发环境
4 tomcat8.5+ 运行环境
5 fastjson json数据封装对象

数据表结构及测试数据

DROP TABLE IF EXISTS `province`;
CREATE TABLE `province`  (
  `id` varchar(6) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
  `name` varchar(100) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

INSERT INTO `province` VALUES ('360000', '江西省');
INSERT INTO `province` VALUES ('360100', '南昌市');
INSERT INTO `province` VALUES ('360101', '西湖区');
INSERT INTO `province` VALUES ('360102', '东湖区');
INSERT INTO `province` VALUES ('360200', '赣州市');
INSERT INTO `province` VALUES ('360201', '章贡区');
INSERT INTO `province` VALUES ('360202', '开发区');
INSERT INTO `province` VALUES ('360203', '南康区');
INSERT INTO `province` VALUES ('360204', '瑞金市');
INSERT INTO `province` VALUES ('360205', '崇义县');
INSERT INTO `province` VALUES ('400000', '广东省');
INSERT INTO `province` VALUES ('400100', '广州市');
INSERT INTO `province` VALUES ('400101', '白云区');
INSERT INTO `province` VALUES ('400102', '黄浦区');
INSERT INTO `province` VALUES ('400103', '海珠区');
INSERT INTO `province` VALUES ('400200', '深圳市');
INSERT INTO `province` VALUES ('400201', '福田区');
INSERT INTO `province` VALUES ('400202', '南山区');

 ProvinceVo.java(javabean)

package com.bean;

import java.io.Serializable;

public class ProvinceVo  implements Serializable {

    private String id;
    private String name;


    public String getId() {
        return id;
    }

    public void setId(String id) {
        this.id =