学步园

<div id="tabContent"></div>
<script type="text/javascript" src="${ rootpath}/res/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="${ rootpath}/res/js/jsrender.min.js"></script>


<script type="text/x-jsrender" id="tablist">
	<table cellspacing="0" cellpadding="0" width="100%" border="1">
		<tr style="height:30px;background-color: #6293bb;">
			<th>主题</th>
			<th>回复</th>
			<th>作者</th>
			<th>阅读</th>
			<th>更新时间</th>
		</tr>
		{{for topicList}}
			<tr>
				<td align="left" style="padding-left:5px;">
					{{if pstatus == '1'}}
						<img src="${rootpath}/res/images/read_topic.gif" />
					{{else}}
						<img src="${rootpath}/res/images/unread_topic.gif" />
					{{/if}}					
					<a href="#" style="padding-left:5px;">{{:title }}</a>
				</td>
				<td>{{:reply }}</td>
				<td>{{:username }}</td>
				<td>{{:readcount }}</td>
				<td>{{:pdate }}</td>
			</tr>
		{{/for}}
	</table>	
</script>


<script type="text/javascript">
jQuery.post("${rootpath}/topic/list.action",{},
	function(data, textStatus, jqXHR)
	{
		var tabCon = $("#tablist").render(data);
		$("#tabContent").html(tabCon);
	},
"json");
</script>

后台逻辑：

@RequestMapping(value="/list", method=RequestMethod.POST)
	public void indexForList(HttpServletRequest request, HttpServletResponse response) throws IOException
	{
		List<Topic> list = topicService.queryTopicList();
		response.setContentType("application/json;charset=UTF-8");
		Map<String, List<Topic>> map = new HashMap<>();
		map.put("topicList", list);
		
		response.getWriter().print(new Gson().toJson(map));
		response.getWriter().close();
	}