springMVC使用ajax返回json对象,用jquery进行解析.

今天学了springMVC使用ajax返回json对象,并在前台页面用jquery进行遍历,大家看完了可以尝试做一个简单的二/三级联动哦,

首先先导好spring+springMVC,jar包,这个大家都清楚,就不一一细列了,除外还需要导入两个json用的jar :

jackson-core-asl-1.9.7.jar

  jackson-mapper-asl-1.9.7.jar

还有jquery-3.1.1.min.js

好了,下面开始代码演示 : 

1.applicationContext.xml配置 :

<?xml version="1.0" encoding="UTF-8"?>  <beans xmlns="http://www.springframework.org/schema/beans"      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"      xmlns:mvc="http://www.springframework.org/schema/mvc"    xmlns:context="http://www.springframework.org/schema/context"      xmlns:tx="http://www.springframework.org/schema/tx"       xmlns:aop="http://www.springframework.org/schema/aop"      xsi:schemaLocation="http://www.springframework.org/schema/beans                         http://www.springframework.org/schema/beans/spring-beans.xsd                          http://www.springframework.org/schema/context                         http://www.springframework.org/schema/context/spring-context-3.0.xsd                          http://www.springframework.org/schema/tx                          http://www.springframework.org/schema/tx/spring-tx-3.0.xsd                          http://www.springframework.org/schema/aop                         http://www.springframework.org/schema/aop/spring-aop-3.0.xsd                        http://www.springframework.org/schema/mvc                 http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">        <!-- 开启注解 --><context:annotation-config/>       <!-- 扫描包设置 --><context:component-scan base-package="com.zrrd.*"/> <!-- 启用3.0新注解 -->    <mvc:annotation-driven />  <!-- 启动Spring MVC的注解功能，完成请求和注解POJO的映射 -->    <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"/></beans>

2.web.xml

<?xml version="1.0" encoding="UTF-8"?><web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">    <welcome-file-list>   <welcome-file>index.jsp</welcome-file>    </welcome-file-list>  <context-param>      <param-name>contextConfigLocation</param-name>      <param-value>classpath:applicationContext.xml</param-value>  </context-param>  <!-- 服务器启动时，通过监听器初始化Spring的配置环境       监听器，默认加载文件是：/WEB-INF/applicationContext.xml  -->  <listener>      <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>  </listener>    <!-- 配置字符集过滤器 --><filter><filter-name>encodingFilter</filter-name>    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>    <init-param>          <param-name>encoding</param-name>          <param-value>UTF-8</param-value>    </init-param>    <init-param>         <param-name>forceEncoding</param-name>         <param-value>true</param-value>     </init-param></filter><filter-mapping>     <filter-name>encodingFilter</filter-name>     <url-pattern>/*</url-pattern></filter-mapping>    <!--    springMVC 核心控制器   --><servlet><servlet-name>dispatcherServlet</servlet-name><servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class><!-- 初始化参数  springmvc 配置文件 --><init-param><param-name>contextConfigLocation</param-name><param-value>classpath:applicationContext.xml</param-value></init-param><load-on-startup>1</load-on-startup></servlet><servlet-mapping><servlet-name>dispatcherServlet</servlet-name><url-pattern>*.do</url-pattern></servlet-mapping></web-app>

3.实体类entity:

package com.zrrd.json.controller;/** * @user : vcen * @ClassName: Student * @TODO : 学生实体类 * @date 2016-12-12 下午12:41:13 */public class Student {private int stuId;private String stuName;private String stuSex;public int getStuId() {return stuId;}public void setStuId(int stuId) {this.stuId = stuId;}public String getStuName() {return stuName;}public void setStuName(String stuName) {this.stuName = stuName;}public String getStuSex() {return stuSex;}public void setStuSex(String stuSex) {this.stuSex = stuSex;}}

4.controller : 

package com.zrrd.json.controller;import java.util.ArrayList;import java.util.List;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.ResponseBody;/** * @user : vcen * @ClassName: JosnController * @TODO : controller控制层 * @date 2016-12-12 下午12:37:43 */@Controller@RequestMapping("josnController")public class JosnController {@ResponseBody@RequestMapping("ajaxTest.do")public List<Student> test(){List<Student> list = new ArrayList<Student>();//注入值Student stu = new Student();stu.setStuId(1);stu.setStuName("张三");stu.setStuSex("男");list.add(stu);Student stu2 = new Student();stu2.setStuId(2);stu2.setStuName("李四");stu2.setStuSex("女");list.add(stu2);return list;  //直接返回list对象}}

前台显示页面 : 

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <base href="<%=basePath%>">        <title>My JSP 'index.jsp' starting page</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0">    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!-- 引入jquery文件 --><script type="text/javascript" src="<%=path%>/js/jquery-3.1.1.min.js"></script>  </head>    <body>        <button onclick="$.clickJson()">点我</button>        <div id="div1"></div>                <script type="text/javascript">        $.extend({clickJson:function(){          $.ajax({   type: "POST",   url: "<%=path%>/josnController/ajaxTest.do",   success: function(msg){      //msg : 返回的json对象     // i :元素下标   , n : 遍历出来的学生对象       $.each(msg,function(i,n){       $("#div1").append("<p>"+n.stuId+","+n.stuName+","+n.stuSex+"</p>");       });   }});        }});        </script>  </body></html>

好了,演示到这里吧!!!