jsp代码

<script type="text/javascript">
    $(function() {
        initProvinces();
    });
    /**
     * 获取省列表
     */
    function initProvinces() {
        $('#province').empty();
        $.ajax({
            type : "POST",
            url : basePath + "district/getProvinces.do",
            success : function(data) {
                $.each(data, function(i, it) {
                    $("<option value='" + it.id + "' />"
                        + it.name + "<br>").click(function() {
                            initCities(it.id);
                    }).appendTo($('#province'));
                });
            }
       });
    }
    /**
     * 获取市列表
     */
    function initCities(provinceID) {
        $('#city').empty();
        $.ajax({
            type : "POST",
            url : basePath + "district/getCities.do?province=" + provinceID,
            success : function(data) {
                $.each(data, function(i, it) {
                    $("<option value='" + it.id + "' />"
                        + it.name + "<br>").click(function() {
                            initCounties(it.id);
                    }).appendTo($('#province'));
                });
            }
        });
    }
    /**
     * 获取区县列表
     */
    function initCounties(cityID) {
        $('#county').empty();
        $.ajax({
            type : "POST",
            url : basePath + "district/getCounties.do?city=" + cityID,
            success : function(data) {
                $.each(data, function(i, it) {
                    $("<option value='" + it.id + "' />"
                        + it.name + "<br>")
                    .appendTo($('#province'));
                });
            }
 });
}
//……
</script>
<body>
 选择地区:
 <select id='province'><option>---省---</option></select>
 <select id='city'><option>---市---</option></select>
 <select id='county'><option>---区---</option></select>
</body>
spring MVC 代码:

@Controller
@RequestMapping(value = "/district")
public class districtController {
    @Resource
    private DistrictService districtService;
 /**
  * 获取省列表
  * @return
  * @throws Exception
  */
 @RequestMapping(value = "getProvinces")
 @ResponseBody
 public Object getProvinces() throws Exception {
    return districtService.getProvinces();
 }
 /**
  * 获取市列表
  * @param province
  * @return
  * @throws Exception
  */
 @RequestMapping(value = "getCities")
 @ResponseBody
 public Object getCities(@RequestParam(value = "province") String province) throws Exception {
    return districtService.getCities();
 }
    // 再往下级的获取方式和getCities方法都相同,所以此处略过
}

3个select。 第一个select的option是写到页面的或者jsp标签。然后给这个select的change绑定事件,让这个事件去加载第二个select的option。同样,给第二个select也绑定一个change事件去加载第三个select的数据。

//绑定事件
$("#select1").live(change,function(){
    $.ajax({
        url:aaaa,//提交的地址
        data:{
            select1id:$("#select1").val();
        }
        type:'post',
        datatype:'json',
        success:function(return){
            $("#select2 option").remove();//清空原来的选项
            ;i<return.length;i++)
            {
              $("#select2").append("<option val='"+return[i].value+"'> "+return[i].name+"</option>")
            }
        }
    })
})
@requestMapping("/")
@responseBody
public List<City> getCitysByErea(String ereaid,HttpServletRequest request,HttpServletResponse response){
    List<City> citys =cityService.getXXX(erarid);
    return citys;
}

Spring MVC+JSP实现三级联动的更多相关文章

  1. [Spring MVC] - JSP + Freemarker视图解释器整合

    Spring MVC中如果只使用JSP做视图,可以使用下面这段即可解决: <!-- 视图解释类 --> <bean class="org.springframework.w ...

  2. spring mvc jsp运行不起来的问题

    spring mvc已经处理成让jsp运行,即: <bean class="org.springframework.web.servlet.view.InternalResourceV ...

  3. [Spring MVC] - JSP + Freemarker视图解释器整合(转)

    Spring MVC中如果只使用JSP做视图,可以使用下面这段即可解决: <!-- 视图解释类 --> <bean class="org.springframework.w ...

  4. ajax+jsp实现三级联动下拉框

    js文件sjld.js  : $(document).ready( function(){ $.ajax({ url:"bindZ", type:"get", ...

  5. 【WEB】初探Spring MVC框架

    Spring MVC框架算是当下比较流行的Java开源框架.但实话实说,做了几年WEB项目,完全没有SpringMVC实战经验,乃至在某些交流场合下被同行严重鄙视“奥特曼”了.“心塞”的同时,只好默默 ...

  6. (八)学习MVC之三级联动

    1.新建项目,MVC选择基本模板 2.新建类:Model/Student.cs,数据库信息有三个实体:分别是年级.班级和学生. using System; using System.Collectio ...

  7. Spring MVC page render时jsp中元素相对路径的解决办法

    前段时间做了用Spring Security实现的登录和访问权限控制的功能,但是page render使用的是InternalResourceResolver,即在spring的servlet配置文件 ...

  8. spring3 jsp页面使用&lt;form:form modelAttribute=&quot;xxxx&quot; action=&quot;xxxx&quot;&gt;报错,附连接数据库的spring MVC annotation 案例

    在写一个使用spring3 的form标签的例子时,一直报错,错误信息为:java.lang.IllegalStateException: Neither BindingResult nor plai ...

  9. Spring mvc 简单异常配置jsp页面

    原文出处:http://howtodoinjava.com/spring/spring-mvc/spring-mvc-simplemappingexceptionresolver-example/ 这 ...

随机推荐

  1. LeetCode之100. Same Tree

    ------------------------------------------ 递归比较即可 AC代码: /** * Definition for a binary tree node. * p ...

  2. 安装MySQL(简便)

    1.在本地虚拟机上上传mysql的5个安装包 2.查看opt目录下是否有这5个安装包 yum install /var/opt/mysql-community-* -y //安装MySQL syste ...

  3. 黑马程序员:Java编程_动态代理

    =========== ASP.Net+Android+IOS开发..Net培训.期待与您交流!=========== 长沙人从长沙的代理商手中买宏基电脑和直接跑到宏基总部买电脑,最终的主体业务目标有 ...

  4. Compound Interest Calculator1.0

    Compound Interest Calculator1.0 客户说:帮我开发一个复利计算软件. 计算:本金为100万,利率或者投资回报率为3%,投资年限为30年,那么,30年后所获得的利息收入:按 ...

  5. 纪录一个table元素里面的tr th td

    <table border="1"> <tr> <th>name</th> <th>sex</th> < ...

  6. Tomcat详细用法学习(三)

    本篇接上一篇<Tomcat详细用法学习(二)>,主要讲解服务器所要求的web应用的组织结构. 上一篇说到了如何使用服务器将自己的web应用映射成虚拟目录,以便于在浏览器中可以对自己开发的w ...

  7. CF528D. Fuzzy Search [FFT]

    CF528D. Fuzzy Search 题意:DNA序列,在母串s中匹配模式串t,对于s中每个位置i,只要s[i-k]到s[i+k]中有c就认为匹配了c.求有多少个位置匹配了t 预处理\(f[i][ ...

  8. D: Starry的神奇魔法(矩阵快速幂)

    题目链接:https://oj.ismdeep.com/contest/Problem?id=1284&pid=3 D: Starry的神奇魔法 Time Limit: 1 s      Me ...

  9. Shell获取指定时间

    时区基本知识 相差一个时区(经度15度)时间相差一小时.简单计算口诀:1.同一个时区的相差时间用减法,2.不同时区的相差时间用加法.3东加西减.例如一,东八区是8点,问东1区几点.根据上面口诀1,算: ...

  10. odoo开发笔记 -- 用户配置界面如何增加模块访问权限

    在odoo设置界面,点击用户,进入用户配置界面,会看到: 访问权 | 个人资料菜单 在访问权 page菜单界面,可以看到系统预制的一些模块都会显示在这里, 那么,我们自己开发的模块如何显示在这块呢,从 ...