前端学习笔记：省市区三级联动

前端学习笔记：省市区三级联动

 

一、数据库

sql表是自关联的表。

表名：province_city_district
字段：
id：区域自身的id
pid：区域的父级id
name：区域自身的名字

 

二、搭工程
1. 创建工程：Create New Project-->Empty Project, Project name=exercises01, Finish
2. 创建项目：New-->Module-->Java Enterprise, Java EE version=Java EE 6, Additional Libraries and Frameworks=Web Application(3.0), Versions=3.0, 选中Create web.xml-->Next, Module name=exercise01
3. 在src文件夹下建立层级
数据库层：com.itcast.dao
数据封装：com.itcast.domain
业务层：com.itcast.service
servlet包：com.itcast.servlet
工具包：com.itcast.utils
4. 导入jar包
在web/WEB-INF文件夹下建立文件夹lib，将jar包放入lib文件夹下，所需要的jar包有：
c3p0的：c3p0-0.9.2-pre5.jar, mchange-commons-java-0.2.3.jar。 c3p0-config.xml文件则放入src文件夹下。
mysql驱动：mysql-connector-java-5.1.39-bin.jar
dbcp的：commons-dbcp-1.4.jar, commons-pool-1.6.jar
dbutils的：commons-dbutils-1.4.jar
json的：flexjson-3.3.jar
5.导入jquery包
在web文件夹下创建文件夹js，在js中放入jquery的文件，文件名为：jquery-1.11.3.min.js
6.配置tomcat
(1)Run-->Edit Configuration, 点击+，选Tomcat Server-->Local
(2)Name=tomcat8, 在Server标签页中，点击Configure按钮，Tomcat Home选择tomcat的安装目录，libraries选择tomcat安装目录下的lib文件夹，加入jsp-api.jar和servlet-api.jar
(3)在Deployment标签页中，Application context=/项目名称，即：Application context=/exercise01
 

 

三、核心代码：

//file name:area.jsp, directory: [Project name]/web/area.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


   
   
   


   
        ---请选择省---
   
   
        ---请选择市---
   
   
        ---请选择县区---
   

 

全部代码和笔记已经以资源的形式上传到CSDN，搜索关键字为：省市三级联动_代码和笔记

链接为：https://download.csdn.net/download/elizabethxxy/11952616