用Springmvc 返回json数据，填充html 或 jsp页面。

maven pom.xml:

   <!-- net json -->
    <dependency>
    <groupId>net.sf.json-lib</groupId>
    <artifactId>json-lib</artifactId>
    <version>2.4</version>
    <classifier>jdk15</classifier>
</dependency>

不会Maven的可以百度 net.sf.json 包。  其中注意， 指定 <classifier> 为jdk15 

Controller:

	@RequestMapping(value="staff_value",produces="application/json")  //访问路径 和返回的json
	@ResponseBody
	public JSONObject staff_value(){

	   String staff_user=admin;
	  JSONObject jsono = new JSONObject();
	   jsono.put("username",staff_user);
	  
	   JSONArray jsonArray = new JSONArray();
	   jsonArray.add(jsono);
	   
	   jsono.element("people", jsonArray);
	   staff_user=null;
	  return jsono;
	}

    java 代码已经完成。

 

接着数据渲染模板采用Handlebars. 百度下载， 在webapp 加入Handlebars-v4.0.5.js. 我先写一个demo, 各位如果想详细了解这个渲染引擎

可以参考其他的人的博客。  接着在你的视图加一个html页面， 或者jsp页面。 导入 Handlebars.js 的js文件。

<script type="text/javascript" src="/zd_web_/Handlebars/handlebars-v4.0.5.js"></script>  //写上你自己下载的Handlebars.js 

要渲染的div:

<div id="list">  </div>

定义渲染模板：

 <script id="people-template" type="text/x-handlebars-template">  //定义一个模板
      {{#people}}
        <div class="person">
           <a>{{userName}}</a>
        </div>
      {{/people}}
    </script>

people-template是你想渲染的模板， 在下面的的初始化脚本中， 我们用 Handlebars.compile 预编译这个模板，  people 和username 对应上面控制器的

jsono.element("people")

和

jsono.put("username",staff_user);

 初始化脚本：

<script type="text/javascript">
$(document).ready(function(){
	var template =Handlebars.compile($("#people-template").html());   // 预编译模板
	
	$.ajax({
		 url:'http://localhost:8080/zd_web_/admin/welcome_admin',    //你的Controller请求路径
		 dataType:'json',
		 success:function(data){   //返回成功后的数据   ！注意返回的json数据格式是 {r:[{username:admin}]}   返回的是json对象 不是json字符串
			
			 $('#list').html(template(data));
		 }
	});
}) 
</script>

 

如上。 这样就完成了从Springmvc 返回 json 数据并且填充到html  或者jsp页面的demo.