創建一個項目，在web目錄下新建一個assets/js目錄，加入jquery和json2的js文件，在lib下加入fastjson的jar文件。
Book3Controller
package com.wen.controller;
import com.wen.domain.Book;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.util.ArrayList;
import java.util.List;
@Controller
public class Book3Controller {
@RequestMapping(value = "/test3RequestBody")
//@ResponseBody會將集合數據轉換成json格式並將其返回給客戶端
@ResponseBody
public Object getJson(){
List<Book> bookList = new ArrayList<>();
bookList.add(new Book(1,"小豬豬","xiaoxiaorui"));
bookList.add(new Book(2,"小貓咪","xiaoxiaorui"));
return bookList;
}
}
index.jsp
<html>
<head>
<title>測試返回JSON格式的數據</title>
<script type="text/javascript" src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/json2.js"></script>
<script type="text/javascript">
$(document).ready(function () {
testResponseBody();
});
function testResponseBody() {
$.ajax({
dataType: "json",//預期服務器返回的數據類型
type: "post",//請求方式post 或 get
url: "${pageContext.request.contextPath}/test3RequestBody",//發送請求的URL字符串
contentType: "application/json",//發送信息至服務器時的內容編碼格式
async: true,//默認設置下，所有請求均為異步請求。如果設置為false，則發送同步請求
success: function (data) {//請求成功的回調函數
$.each(data,function () {
var tr=$("<tr align='center'/>");
$("<td/>").html(this.id).appendTo(tr);
$("<td/>").html(this.name).appendTo(tr);
$("<td/>").html(this.author).appendTo(tr);
$("#book-table").append(tr);
})
},
error: function () {
alert("數據加載失敗")
}
})
}
</script>
</head>
<body>
<table id="book-table" border="1" style="border-collapse: collapse">
<tr align="center">
<th>編號</th>
<th>書名</th>
<th>作者</th>
</tr>
</table>
</body>
</html>
因為spring中，我們使用的是fastjson處理json數據，因此還需要對springmvc-config.xml和web.xml進行一些其他配置，可以參考之前關於springmvc的文章。
