我們知道使用AJAX是為了提供更好的用戶體驗、提高程序的性能，在實際的開發中有時候不免會遇到從后台數據庫讀取大量的數據然后在前台加載顯示的情況，我們之前兩節都有講過從前台向后台請求數據、登錄驗證之類的。但是那些都是在數據量較小的情況下，如果請求的數據比較多，這個時候大量數據的傳輸就成了一個問題，如何將后台的數據傳輸至前台並顯示呢？這里就要用到了JSON！那么什么是JSON呢？之前我在《Serialization全解析》這一篇文章中講到過，這里就再給大家稍微的講一下，JSON(即：JavaScript Object Notation) 是一種輕量級的數據交換格式。Json的語法規則其實很簡單：對象是一個無序的“‘名稱/值’對”集合。一個對象以“{”（左括號）開始，“}”（右括號）結束。每個“名稱”后跟一個“:”（冒號）；“‘名稱/值’ 對”之間使用“,”（逗號）分隔。
如下示例：
{
"people": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb"},
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]
}
下面我會通過一個示例示例向大家演示如何從JQuery+Json無刷新的從后台讀取數據。
新建一個ASP.NET web應用程序，在項目下新建一個Linq to Sql類文件P.dbml，將數據庫中Person表拖到該文件中，形成數據庫數據和對象的映射，如圖示：
然后新建一個ShowPerson.htm頁，布局如下：
<body>
<h1>Hello! This is the ShowPerson Page!</h1>
<input id="btnshow" type="button" value="Show All Person" onclick="ShowPerson()" />
<div id="pdiv" style="width:300px; height:300px; background:green">
<table id="showtable"></table>
</div>
</body>
在<head></head>節點里寫如下代碼：
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>//引用JS文件，VS2010里Script文件夾里自帶的都有，添加后可以使用jQuery，會有提示
<script type="text/javascript">
function ShowPerson{
//采用$.post()方法向后台請求數據
$.post("GetPerson.ashx", { i: Math.random() }, function (data, textStatus) {
//請求成功，返回處理數據
if (textStatus == "success") {
alert(data);//顯示一些返回的數據，主要做測試用
var ps = $.parseJSON(data);//使用$.parseJSON(data)解析從后台請求的Json格式的數據
var table = $("#showtable");
for (var i = 0; i < ps.length; i++) {//經過解析后，將從后太讀取的數據逐條添加到頁面中顯示
var item = ps[i];
var row = $("<tr><td>" + item.PName + "</td><td>" + item.PSex + "</td><td>" + item.PAge
+ "</td><td>" + item.PJob + "</td></tr>");
table.append(row);
}
$("#pdiv").css("background", "lightblue");//添加完成后，將背景色修改，以顯示添加完畢
}
});
}
</script>
下面在新建一個一般處理程序頁GetPerson.ashx頁
代碼如下：
首先需要添加一個引用
using System.Web.Script.Serialization;//使用JavaScriptSerializer()時
using System.Configuration;//使用ConfigurationManager類從配置文件獲得連接字符串用
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
PDataContext pdc = new PDataContext(ConfigurationManager.ConnectionStrings["LinqTestConnectionString"].ToString());
//實例化一個PDataContex
List<Pserson> listp= pdc.Pserson.Where(p => p.PAge > 0).OrderBy(p => p.PAge).ToList();
//從數據庫中讀取年齡大於0歲的人的信息，並轉換為List集合，這里就用到了我們在開始之前新建的Linq TO Sql類的文件，
//通過這個類，很好實現了數據庫數據和類對象的映射（之前的《LINQ學習心得分享-----（五）LINQ TO SQL全解析一節》有詳細的介紹，不太理解的朋友可以先去看一下》）
var personjs = new JavaScriptSerializer();//新建一個JavaScriptSerialize示例，主要用作序列化，將List<Person>集合序列化為Json合適的字符串
var persons = personjs.Serialize(listp);//將List<Person>集合序列化
context.Response.Write(persons);//返回輸出JSON格式的數據
}
當然將List<Person>集合序列化的方式還可以使用DataContractJsonSerializer類的WriteObjec（）方法，但是在使用該類之前應先添加System.ServiceModel.Web 和 System.Runtime.Serialization的引用，然后再添加命名空間：System.Runtime.Serialization.Json
關於使用DataContractJsonSerializer類進行序列化之前在《Serialization全解析》一節有詳細的說明，不太清楚的朋友可以去先看一下。
到這里我們已經實現了無刷新的加載后台打量數據。請先看下結果吧。
加載前：
點擊加載：
作測試用的彈出返回的數據：
加載完畢：
因為數據庫里只有這幾條數據，所以數據顯示的比較少，但是道理就是這樣的，大數據也是這樣實現的。
本章節到這里我們利用JQuery+JSon已經實現了從后台讀取大量的數據。當然這個界面很丑，我們在處理從后台返回的數據時，在逐條處理時可以對數據的樣式進行修飾，這里不作為重點，有興趣的朋友可以自己去研究下。希望可以對朋友們有所幫助，也希望大家多多指教。