![1825deda2112536c5d1aa2f9b500f9c5.png](https://i-blog.csdnimg.cn/blog_migrate/aa9e7f66200fb4aad0594d3d83ec2938.png)
当我们做一些例如注册页面的时候,可能会遇到要选择地址的操作,这时会出现三个选择框,当你选择省级单位的时候会自动在选择筐中,弹出她所属的市级单位的列表,当选择市级单位时又会弹出县级单位,我们要实现的就是这样的三级联动,当然也会有更简单的插件方法,但学习,我们可以通过这来看它运行的过程。我么要实现的需求是这样的:
- 页面中有三个下拉框选项,分别为省下拉框,市下拉框,区/县下拉框
- 选择省,则市下拉框中出现对应的该省下的市信息,选择市,则区/县下拉框中
- 出现对应的该市下面的区/县信息
分析这个实现过程大致可以这样:
- 1、创建页面:页面中有三个下拉框,分别为省、市、区/县
- 2、页面加载成功发起ajax请求,请求省的信息,并将响应结果 填充到省下拉框中
- 3、选择省触发一个新的js函数 的执行,该函数中发起新的ajax请求 请求该省下的市信息,并将响应数据填充到市下拉框
- 4、选择市信息触发一个新的js函数的执行,该函数中发起新的ajax请求 请求该市下的区/县信息,并将数据填充到区/县下拉框中
数据库呢我们可以这样去构建:
创建表(area):存储了省、市、区/县信息
- 设计表实现