springmvc 返回json数据给前台jsp页面展现

<div id="cnblogs_post_body" class="blogpost-body"><p>                        <strong>spring mvc返回json字符串的方式</strong></p> <p><strong>方案一:使用<strong>@ResponseBody&nbsp;</strong>注解返回响应体 直接将返回值序列化json</strong></p> <p><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 优势:不须要本身再处理</strong></p> <p><strong>步骤一:在spring-servlet.xml文件中配置以下代码</strong></p> <div class="cnblogs_code"><div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div> <pre><span style="color: #0000ff">&lt;?</span><span style="color: #ff00ff">xml version="1.0" encoding="UTF-8"</span><span style="color: #0000ff">?&gt;</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">beans </span><span style="color: #ff0000">xmlns</span><span style="color: #0000ff">="http://www.springframework.org/schema/beans"</span><span style="color: #ff0000"></br> xmlns:xsi</span><span style="color: #0000ff">="http://www.w3.org/2001/XMLSchema-instance"</span><span style="color: #ff0000"></br> xmlns:p</span><span style="color: #0000ff">="http://www.springframework.org/schema/p"</span><span style="color: #ff0000"></br> xmlns:mvc</span><span style="color: #0000ff">="http://www.springframework.org/schema/mvc"</span><span style="color: #ff0000"></br> xmlns:context</span><span style="color: #0000ff">="http://www.springframework.org/schema/context"</span><span style="color: #ff0000"></br> xsi:schemaLocation</span><span style="color: #0000ff">="</br> http://www.springframework.org/schema/beans</br> http://www.springframework.org/schema/beans/spring-beans.xsd</br> http://www.springframework.org/schema/context</br> http://www.springframework.org/schema/context/spring-context.xsd</br> http://www.springframework.org/schema/mvc</br> http://www.springframework.org/schema/mvc/spring-mvc.xsd "</span><span style="color: #0000ff">&gt;</span></br>javascript

<span style="color: #008000">&lt;!--</span><span style="color: #008000">使用Annotation方式 完成映射  </span><span style="color: #008000">--&gt;</span></br>
 <span style="color: #008000">&lt;!--</span><span style="color: #008000">让spring扫描包下全部的类,让标注spring注解的类生效  </span><span style="color: #008000">--&gt;</span></br>
 <span style="color: #0000ff">&lt;</span><span style="color: #800000">context:component-scan </span><span style="color: #ff0000">base-package</span><span style="color: #0000ff">="cn.yxj.controller"</span><span style="color: #0000ff">/&gt;</span></br>
 <span style="color: #0000ff">&lt;</span><span style="color: #800000">mvc:annotation-driven</span><span style="color: #0000ff">/&gt;</span>  </br>
 <span style="color: #008000">&lt;!--</span><span style="color: #008000">视图解析器  </span><span style="color: #008000">--&gt;</span></br>
 <span style="color: #0000ff">&lt;</span><span style="color: #800000">bean </span><span style="color: #ff0000">class</span><span style="color: #0000ff">="org.springframework.web.servlet.view.InternalResourceViewResolver"</span><span style="color: #0000ff">&gt;</span></br>
 <span style="color: #0000ff">&lt;</span><span style="color: #800000">property </span><span style="color: #ff0000">name</span><span style="color: #0000ff">="prefix"</span><span style="color: #ff0000"> value</span><span style="color: #0000ff">="/WEB-INF/jsp/"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">property</span><span style="color: #0000ff">&gt;</span></br>
 <span style="color: #0000ff">&lt;</span><span style="color: #800000">property </span><span style="color: #ff0000">name</span><span style="color: #0000ff">="suffix"</span><span style="color: #ff0000"> value</span><span style="color: #0000ff">=".jsp"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">property</span><span style="color: #0000ff">&gt;</span>
 <span style="color: #0000ff">&lt;/</span><span style="color: #800000">bean</span><span style="color: #0000ff">&gt;</span></br>

<span style="color: #0000ff"></</span><span style="color: #800000">beans</span><span style="color: #0000ff">></span></pre>html

<div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div></div> <p>步骤二:在处理器方法中打上<strong>@ResponseBody&nbsp;&nbsp;</strong>标签</p> <div class="cnblogs_code"><div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div> <pre>@RequestMapping(value="/hello5.do"<span style="color: #000000">)</br> @ResponseBody</br> </span><span style="color: #0000ff">public</span> String hello(HttpServletResponse response) <span style="color: #0000ff">throws</span><span style="color: #000000"> IOException{</br> UserInfo u1</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br> u1.setAge(</span>15<span style="color: #000000">);</br> u1.setUname(</span>"你好"<span style="color: #000000">);</br></br>java

UserInfo u2</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br>
    u2.setAge(</span>152<span style="color: #000000">);</br>
    u2.setUname(</span>"你好2"<span style="color: #000000">);</br>
    Map</span>&lt;String,UserInfo&gt; map=<span style="color: #0000ff">new</span> HashMap&lt;String, UserInfo&gt;<span style="color: #000000">();</br>
    map.put(</span>"001"<span style="color: #000000">, u1);</br>
    map.put(</span>"002"<span style="color: #000000">, u2);</br>
    String jsonString </span>=<span style="color: #000000"> JSON.toJSONString(map);</br>
    </span><span style="color: #0000ff">return</span><span style="color: #000000"> jsonString;</br>
}</span></pre>

<div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div></div> <p>步骤三:使用ajax进行获取数据</p> <div class="cnblogs_code"><div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div> <pre><span style="background-color: #ffff00; color: #000000">&lt;%</span><span style="background-color: #f5f5f5; color: #000000">@ page language</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">java</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000"> import</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">java.util.*</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000"> pageEncoding</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">utf-8</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #ffff00; color: #000000">%&gt;</span> <span style="background-color: #ffff00; color: #000000">&lt;%</span></br> <span style="background-color: #f5f5f5; color: #0000ff">String</span><span style="background-color: #f5f5f5; color: #000000"> path </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> request.getContextPath();</br> </span><span style="background-color: #f5f5f5; color: #0000ff">String</span><span style="background-color: #f5f5f5; color: #000000"> basePath </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> request.getScheme()</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">://</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">request.getServerName()</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">:</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">request.getServerPort()</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">path</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">/</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000">; </span><span style="background-color: #ffff00; color: #000000">%&gt;</span></br></br>jquery

<span style="color: #0000ff"><!</span><span style="color: #ff00ff">DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"</span><span style="color: #0000ff">></span> <span style="color: #0000ff"><</span><span style="color: #800000">html</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"><</span><span style="color: #800000">head</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"><</span><span style="color: #800000">base </span><span style="color: #ff0000">href</span><span style="color: #0000ff">="<%=basePath%>"</span><span style="color: #0000ff">></span></br></br>web

<span style="color: #0000ff">&lt;</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span>My JSP 'index.jsp' starting page<span style="color: #0000ff">&lt;/</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span></br></br>

<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #ff0000"> src</span><span style="color: #0000ff">="js/jquery-1.8.3.js"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">script</span><span style="color: #0000ff">&gt;</span></br>
<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #0000ff">&gt;</span><span style="background-color: #f5f5f5; color: #000000"></br>
  $(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){
     $(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">#btn</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">).click(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){</br>
         $.ajax({</br>
           url:</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">&lt;%=path%&gt;/Five.do</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">,</br>
           success:</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(data){ </br>
           </span><span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">解析对象</span></br>
           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">alert(data.uname+"\n"+data.age);</span></br>
           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">解析map</span></br>
           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">alert(data.info.age+"\n"+data.info.uname);</span></br>
           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">解析list</span></br>

<span style="background-color: #f5f5f5; color: #000000"> $.each(data,</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(i,dom){</br> alert(dom.uname</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">\n</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">dom.age);</br> });</br> }</br> }); });</br> });</br> </span><span style="color: #0000ff"></</span><span style="color: #800000">script</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"></</span><span style="color: #800000">head</span><span style="color: #0000ff">></span></br></br>ajax

<span style="color: #0000ff"><</span><span style="color: #800000">body</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"><</span><span style="color: #800000">input </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="button"</span><span style="color: #ff0000"> value</span><span style="color: #0000ff">="ajax"</span><span style="color: #ff0000"> id</span><span style="color: #0000ff">="btn"</span><span style="color: #0000ff">/></span></br>spring

<span style="color: #0000ff"></</span><span style="color: #800000">body</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"></</span><span style="color: #800000">html</span><span style="color: #0000ff">></span></pre>json

<div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div></div> <p><strong>方案二:处理器方法的返回值---Object</strong></p> <p><strong>  因为返回Object数据,通常都是将数据转化为JSON对象后传递给浏览器页面的,而这个由Object转换为Json,是由Jackson工具完成的,因此要导入jar包,将Object数据转化为json数据,须要Http消息</strong></p> <p><strong>  转换器&nbsp;HttpMessageConverter完成。而转换器的开启,须要由&lt;mvc:annotation-driven/&gt;&nbsp;来完成,当spring容器进行初始化过程当中,在&lt;mvc:annotation-driven/&gt;&nbsp;处建立注解驱动时,默认创</strong></p> <p><strong>  建了七个<strong>HttpMessageConverter对象,也就是说,咱们注册<strong>&lt;mvc:annotation-driven/&gt;</strong>,就是为了让容器帮咱们建立<strong><strong>HttpMessageConverter对象</strong></strong></strong></strong></p> <p><strong><strong><strong><strong><img src="https://images2015.cnblogs.com/blog/803693/201612/803693-20161212111301979-898275310.png" alt=""></strong></strong></strong></strong></p> <p>&nbsp;</p> <p><strong>详细代码看</strong></p> <p><strong>方案2、使用返回字符串的处理器方法,去掉@ResponseBody注解</strong></p> <p>步骤1、同上</p> <p>步骤二</p> <div class="cnblogs_code"><div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div> <pre>@RequestMapping(value="/hello5.do"<span style="color: #000000">)</br> </span><span style="color: #0000ff">public</span> String hello(HttpServletResponse response) <span style="color: #0000ff">throws</span><span style="color: #000000"> IOException{</br> UserInfo u1</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br> u1.setAge(</span>15<span style="color: #000000">);</br> u1.setUname(</span>"你好"<span style="color: #000000">);</br></br>浏览器

UserInfo u2</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br>
    u2.setAge(</span>152<span style="color: #000000">);</br>
    u2.setUname(</span>"你好2"<span style="color: #000000">);</br>
    Map</span>&lt;String,UserInfo&gt; map=<span style="color: #0000ff">new</span> HashMap&lt;String, UserInfo&gt;<span style="color: #000000">();</br>
    map.put(</span>"001"<span style="color: #000000">, u1);</br>
    map.put(</span>"002"<span style="color: #000000">, u2);</br>
    String jsonString </span>=<span style="color: #000000"> JSON.toJSONString(map);</br>
    </span><span style="color: #0000ff">return</span><span style="color: #000000"> jsonString;</br>
}</span></pre>

<div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div></div> <p>步骤3、在前台取值的时候须要我么作一遍处理</p> <div class="cnblogs_code"><div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div> <pre><span style="background-color: #ffff00; color: #000000">&lt;%</span><span style="background-color: #f5f5f5; color: #000000">@ page language</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">java</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000"> import</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">java.util.*</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000"> pageEncoding</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">utf-8</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #ffff00; color: #000000">%&gt;</span> <span style="background-color: #ffff00; color: #000000">&lt;%</span></br> <span style="background-color: #f5f5f5; color: #0000ff">String</span><span style="background-color: #f5f5f5; color: #000000"> path </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> request.getContextPath();</br> </span><span style="background-color: #f5f5f5; color: #0000ff">String</span><span style="background-color: #f5f5f5; color: #000000"> basePath </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> request.getScheme()</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">://</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">request.getServerName()</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">:</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">request.getServerPort()</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">path</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #800000">/</span><span style="background-color: #f5f5f5; color: #800000">"</span><span style="background-color: #f5f5f5; color: #000000">;</br></br> </span><span style="background-color: #ffff00; color: #000000">%&gt;</span></br></br>spring-mvc

<span style="color: #0000ff"><!</span><span style="color: #ff00ff">DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"</span><span style="color: #0000ff">></span> <span style="color: #0000ff"><</span><span style="color: #800000">html</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"><</span><span style="color: #800000">head</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"><</span><span style="color: #800000">base </span><span style="color: #ff0000">href</span><span style="color: #0000ff">="<%=basePath%>"</span><span style="color: #0000ff">></span></br></br>

<span style="color: #0000ff">&lt;</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span>My JSP 'index.jsp' starting page<span style="color: #0000ff">&lt;/</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span></br></br>

<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #ff0000"> src</span><span style="color: #0000ff">="js/jquery-1.8.3.js"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">script</span><span style="color: #0000ff">&gt;</span>
<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #0000ff">&gt;</span><span style="background-color: #f5f5f5; color: #000000"></br>
  $(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){</br>
     $(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">#btn</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">).click(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){</br>
         $.ajax({</br>
           url:</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">&lt;%=path%&gt;/hello5.do</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">,</br>
           success:</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(data){ </span><span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">data指的是从server打印到浏览器的数据</span></br>
               <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">jsonString jsonObject</span></br>
               <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">{"001":{"age":122,"name":"顺利就业"}}</span></br>
              <span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> result</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> eval(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">data</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">)</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">);</br>
               $.each(result,</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(i,dom){</br>
                  alert(dom.age</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">\n</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">dom.uname);</br>
                  
               });</br>
            </span><span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">  alert(result["001"]["age"]);</span>

<span style="background-color: #f5f5f5; color: #000000"> }</br> });</br> });</br> });</br> </span><span style="color: #0000ff"></</span><span style="color: #800000">script</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"></</span><span style="color: #800000">head</span><span style="color: #0000ff">></span></br></br>

<span style="color: #0000ff"><</span><span style="color: #800000">body</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"><</span><span style="color: #800000">input </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="button"</span><span style="color: #ff0000"> value</span><span style="color: #0000ff">="ajax"</span><span style="color: #ff0000"> id</span><span style="color: #0000ff">="btn"</span><span style="color: #0000ff">/></span></br></br>

<span style="color: #0000ff"></</span><span style="color: #800000">body</span><span style="color: #0000ff">></span></br> <span style="color: #0000ff"></</span><span style="color: #800000">html</span><span style="color: #0000ff">></span></pre>

<div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div></div> <p>方案三:使用无返回值的处理器方法</p> <p>步骤一:同上</p> <p>步骤二:使用响应流回送数据</p> <div class="cnblogs_code"><div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div> <pre>@RequestMapping(value="/hello5.do"<span style="color: #000000">)</br> </span><span style="color: #0000ff">public</span> <span style="color: #0000ff">void</span> hello(HttpServletResponse response) <span style="color: #0000ff">throws</span><span style="color: #000000"> IOException{</br> UserInfo u1</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br> u1.setAge(</span>15<span style="color: #000000">);</br> u1.setUname(</span>"你好"<span style="color: #000000">);</br></br>

UserInfo u2</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br>
    u2.setAge(</span>152<span style="color: #000000">);</br>
    u2.setUname(</span>"你好2"<span style="color: #000000">);</br>
    Map</span>&lt;String,UserInfo&gt; map=<span style="color: #0000ff">new</span> HashMap&lt;String, UserInfo&gt;<span style="color: #000000">();</br>
    map.put(</span>"001"<span style="color: #000000">, u1);</br>
    map.put(</span>"002"<span style="color: #000000">, u2);</br>
    String jsonString </span>=<span style="color: #000000"> JSON.toJSONString(map);</br>
    response.setCharacterEncoding(</span>"utf-8"<span style="color: #000000">);
    response.getWriter().write(jsonString);</br>
    response.getWriter().close();</br>
    </br>
}</span></pre>

<div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div></div> <p>步骤三:在前台取值也须要作处理</p> <div class="cnblogs_code"><div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div> <pre>&lt;%@ page language="java" <span style="color: #0000ff">import</span>="java.util.*" pageEncoding="utf-8"%&gt; &lt;%<span style="color: #000000"> String path </span>=<span style="color: #000000"> request.getContextPath(); String basePath </span>= request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"<span style="color: #000000">; </span>%&gt;</br>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"></br> <html></br> <head></br> <base href="<%=basePath%>"></br></br>

&lt;title&gt;My JSP 'index.jsp' starting page&lt;/title&gt;</br></br>

&lt;script type="text/javascript" src="js/jquery-1.8.3.js"&gt;&lt;/script&gt;</br>
&lt;script type="text/javascript"&gt;<span style="color: #000000">
  $(function(){</br>
     $(</span>"#btn"<span style="color: #000000">).click(function(){</br>
         $.ajax({</br>
           url:</span>"&lt;%=path%&gt;/hello5.do"<span style="color: #000000">,
           success:function(data){ </span><span style="color: #008000">//</span><span style="color: #008000">data指的是从server打印到浏览器的数据</br>
               </span><span style="color: #008000">//</span><span style="color: #008000">jsonString jsonObject</br>
               </span><span style="color: #008000">//</span><span style="color: #008000">{"001":{"age":122,"name":"顺利就业"}}</span></br>
              var result= eval("("+data+")"<span style="color: #000000">);</br>
               $.each(result,function(i,dom){</br>
                  alert(dom.age</span>+"\n"+<span style="color: #000000">dom.uname);</br>
                  </br>
               });</br>
            </span><span style="color: #008000">//</span><span style="color: #008000">  alert(result["001"]["age"]);</span></br>

<span style="color: #000000"> }</br> }); }); }); </span></script></br> </head></br>

<body></br> <input type="button" value="ajax" id="btn"/></br>

</body></br> </html></pre>

<div class="cnblogs_code_toolbar"><span class="cnblogs_code_copy"><a href="javascript:void(0);" onclick="copyCnblogsCode(this)" title="复制代码"><img src="//common.cnblogs.com/images/copycode.gif" alt="复制代码"></a></span></div></div> <p>&nbsp;</p></div>

相关文章
相关标签/搜索