介于目前的情況，獲取的數(shù)據(jù)只有一頁(yè)，沒(méi)有所有的頁(yè)碼。
試試能不能偽裝一下后端分頁(yè)的情況，就是開啟后端分頁(yè)，在請(qǐng)求之前，將傳入的數(shù)據(jù)進(jìn)行重組，在獲取到數(shù)據(jù)后，將返回的數(shù)據(jù)按照后端分頁(yè)的數(shù)據(jù)格式組裝一遍。

經(jīng)過(guò)測(cè)試，是可以的。

三、實(shí)現(xiàn)

通過(guò)DataTables配置參數(shù)ajax項(xiàng)實(shí)現(xiàn)的。關(guān)于ajax詳細(xì)介紹請(qǐng)看官方說(shuō)明：中文 | 英文

ajax接收三種類型的參數(shù)：
*string：設(shè)置獲取數(shù)據(jù)的url
*object：和 jQuery.ajax 定義類似
*function：自定義獲取數(shù)據(jù)的功能
直接上代碼吧，都有注釋。
前端頁(yè)面代碼：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>jquery DataTables插件自定義分頁(yè)ajax實(shí)現(xiàn)</title>
 <link  rel="stylesheet" media="screen">
 <link  rel="stylesheet" media="screen">
 <link  rel="stylesheet" media="screen">
</head>
<body>
<div class="row-fluid">
 <h3>JQuery DataTables插件自定義分頁(yè)Ajax實(shí)現(xiàn)</h3>
 <table id="example" class="display table-striped table-bordered table-hover table-condensed" cellspacing="0" width="100%">
 <thead>
 <tr>
 <th>編號(hào)</th>
 <th>姓名</th>
 <th>性別</th>
 </tr>
 </thead>
 </table>
</div>
<script src="http://cdn.bootcss.com/datatables/1.10.11/js/jquery.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://cdn.bootcss.com/datatables/1.10.11/js/jquery.dataTables.min.js"></script>
<script src="http://cdn.bootcss.com/datatables/1.10.11/js/dataTables.bootstrap.min.js"></script>
<script type="text/javascript">
 $(function () {
 //提示信息
 var lang = {
 "sProcessing": "處理中...",
 "sLengthMenu": "每頁(yè) _MENU_ 項(xiàng)",
 "sZeroRecords": "沒(méi)有匹配結(jié)果",
 "sInfo": "當(dāng)前顯示第 _START_ 至 _END_ 項(xiàng)，共 _TOTAL_ 項(xiàng)。",
 "sInfoEmpty": "當(dāng)前顯示第 0 至 0 項(xiàng)，共 0 項(xiàng)",
 "sInfoFiltered": "(由 _MAX_ 項(xiàng)結(jié)果過(guò)濾)",
 "sInfoPostFix": "",
 "sSearch": "搜索:",
 "sUrl": "",
 "sEmptyTable": "表中數(shù)據(jù)為空",
 "sLoadingRecords": "載入中...",
 "sInfoThousands": ",",
 "oPaginate": {
 "sFirst": "首頁(yè)",
 "sPrevious": "上頁(yè)",
 "sNext": "下頁(yè)",
 "sLast": "末頁(yè)",
 "sJump": "跳轉(zhuǎn)"
 },
 "oAria": {
 "sSortAscending": ": 以升序排列此列",
 "sSortDescending": ": 以降序排列此列"
 }
 };

 //初始化表格
 var table = $("#example").dataTable({
 language:lang, //提示信息
 autoWidth: false, //禁用自動(dòng)調(diào)整列寬
 stripeClasses: ["odd", "even"], //為奇偶行加上樣式，兼容不支持CSS偽類的場(chǎng)合
 processing: true, //隱藏加載提示,自行處理
 serverSide: true, //啟用服務(wù)器端分頁(yè)
 searching: false, //禁用原生搜索
 orderMulti: false, //啟用多列排序
 order: [], //取消默認(rèn)排序查詢,否則復(fù)選框一列會(huì)出現(xiàn)小箭頭
 renderer: "bootstrap", //渲染樣式：Bootstrap和jquery-ui
 pagingType: "simple_numbers", //分頁(yè)樣式：simple,simple_numbers,full,full_numbers
 columnDefs: [{
 "targets": 'nosort', //列的樣式名
 "orderable": false //包含上樣式名‘nosort'的禁止排序
 }],
 ajax: function (data, callback, settings) {
 //封裝請(qǐng)求參數(shù)
 var param = {};
 param.limit = data.length;//頁(yè)面顯示記錄條數(shù)，在頁(yè)面顯示每頁(yè)顯示多少項(xiàng)的時(shí)候
 param.start = data.start;//開始的記錄序號(hào)
 param.page = (data.start / data.length)+1;//當(dāng)前頁(yè)碼
 //console.log(param);
 //ajax請(qǐng)求數(shù)據(jù)
 $.ajax({
 type: "GET",
 url: "/hello/list",
 cache: false, //禁用緩存
 data: param, //傳入組裝的參數(shù)
 dataType: "json",
 success: function (result) {
 //console.log(result);
 //setTimeout僅為測(cè)試延遲效果
 setTimeout(function () {
 //封裝返回?cái)?shù)據(jù)
 var returnData = {};
 returnData.draw = data.draw;//這里直接自行返回了draw計(jì)數(shù)器,應(yīng)該由后臺(tái)返回
 returnData.recordsTotal = result.total;//返回?cái)?shù)據(jù)全部記錄
 returnData.recordsFiltered = result.total;//后臺(tái)不實(shí)現(xiàn)過(guò)濾功能，每次查詢均視作全部結(jié)果
 returnData.data = result.data;//返回的數(shù)據(jù)列表
 //console.log(returnData);
 //調(diào)用DataTables提供的callback方法，代表數(shù)據(jù)已封裝完成并傳回DataTables進(jìn)行渲染
 //此時(shí)的數(shù)據(jù)需確保正確無(wú)誤，異常判斷應(yīng)在執(zhí)行此回調(diào)前自行處理完畢
 callback(returnData);
 }, 200);
 }
 });
 },
 //列表表頭字段
 columns: [
 { "data": "Id" },
 { "data": "Name" },
 { "data": "Sex" }
 ]
 }).api();
 //此處需調(diào)用api()方法,否則返回的是JQuery對(duì)象而不是DataTables的API對(duì)象
 });
</script>
</body>
</html>

JSON數(shù)據(jù)格式: