Datatable是jQuery提供的優秀的前端處理表格與分頁的一個框架。接下來就通過簡單的例子，說說datable的整合過程。剛一開始，百度datatable外掛，搜到的大都是一些前臺分頁的例子，看了幾個例子之後，自己嘗試了一下，沒出什麼問題。關於前臺分頁沒什麼難的。
1.在jsp中需要定義一個< thead> 與< tbody>標籤，datatable應該會掃描這個標籤。
2.引入datatable，css，與js包，這個官網就可以下不用翻牆。

<link href="${pageContext.request.contextPath}/static/css/jquery.dataTables.css" rel="stylesheet" />
<link href="${pageContext.request.contextPath}/static/css/jquery.dataTables.min.css" rel="stylesheet" />
<script type="text/javascript" src="${pageContext.request.contextPath}/static/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery.dataTables.min.js"></script>
 

引入這幾個東西。

<script>
3.$(document).ready(function() {
$('#example11').dataTable({
});
});
</script> 

直接呼叫datatable方法，都適用預設引數，這時候前臺頁面其實就已經分頁成功了。
但是這樣的分頁其實沒有什麼意義，這屬於一次性到資料庫把資料都取出來，沒有做到真正的分頁。接下來重點說說伺服器分頁。最後還是google才查到解決問題的。
直接粘程式碼了

    <p>
</p>$('#example11').dataTable({
  "bFilter": false,//去掉搜尋框
     //"bAutoWidth": true, //自適應寬度
     "sPaginationType" : "full_numbers",
     "bDestroy" : true,
     "bProcessing" : true,
     "bServerSide" : true,
 "sAjaxDataProp" : "aData",//是伺服器分頁的標誌，必須有
  "sAjaxSource" : "${pageContext.request.contextPath}/datatable/datainfo",//通過ajax實現分頁的url路徑。
   "aoColumns" : [ {
      "mDataProp" : "id",
  }, {
      "mDataProp" : "name",
  }, {
      "mDataProp" : "telephone",
  }, {
      "mDataProp" : "email",
  },  ],
  // 如果不知是簡單的資料顯示，需要複雜的要求時，通過以下方法來實現動態js插入。 
  //不知道有沒有更好的方法。
  "aoColumnDefs":[{"aTargets":[1],"mRender":function(){
      return "<a href=#>1441</a>"}
     }],
  "bAutoWidth": true, //自適應寬度
  "sPaginationType" : "full_numbers",
  "oLanguage" : {
      "sProcessing" : "正在載入中......",
      "sLengthMenu" : "每頁顯示 _MENU_ 條記錄",
      "sZeroRecords" : "正在載入中......",
      "sEmptyTable" : "表中無資料存在！",
      "sInfo" : "當前顯示 _START_ 到 _END_ 條，共 _TOTAL_ 條記錄",
      "sInfoEmpty" : "顯示0到0條記錄",
      "sInfoFiltered" : "資料表中共為 _MAX_ 條記錄",
      "sSearch" : "搜尋",
      "oPaginate" : {
          "sFirst" : "首頁",
          "sPrevious" : "上一頁",
          "sNext" : "下一頁",
          "sLast" : "末頁"
      }
  }
});
});
 

    之後在，表格中，tbody就可以空著了，已經通過aoColumns動態注入進去了。

接下來是後臺，涉及到json的地方也很麻煩

@ResponseBody
 @RequestMapping("datainfo")
 public Map<String, Object> datainfo(HttpServletRequest request,Model model,HttpServletResponse response) throws IOException{
 JSONObject jsonobj =new JSONObject();
 jsonobj.put("aData", DatatableDao.userList);
 Map<String, Object> map = new HashMap<String,Object>();
 map.put("sEcho", request.getParameter("sEcho"));
 map.put("iTotalRecords", 30);
 map.put("iTotalDisplayRecords", 30);
 map.put("aData", DatatableDao.userList);
 model.addAttribute("aData",DatatableDao.userList);
 System.out.println(jsonobj.toJSONString());
 return map;
 }
 

      SpringMVC返回json配置步驟如下：
      1、新增jackson.jar包
      2、在applicationContext.xml配製檔案中新增如下程式碼
   

<!--解析返回JSON -->
<!--  <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"> -->
   <bean class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter">
  <property name="messageConverters">
   <list >
    <ref bean="mappingJacksonHttpMessageConverter" />
   </list>
  </property>
 </bean>
 <bean id="mappingJacksonHttpMessageConverter"
  class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
  <property name="supportedMediaTypes">
   <list>
    <value>text/html;charset=UTF-8</value>
   </list>
  </property>
 </bean> 

springmvc預設是不支援map型別轉換成json的，必須加上上面的配置，注意還要倒入jar包（新版的springmvc集成了json，這步可以省略）

<dependencies><dependency>
 <groupId>com.fasterxml.jackson.core</groupId>
 <artifactId>jackson-core</artifactId>
 <version>2.7.1</version>
 </dependency>
 <dependency>
 <groupId>junit</groupId>
 <artifactId>junit</artifactId>
 <version>3.8.1</version>
 <scope>test</scope>
 </dependency>
 <dependency>
 <groupId>com.fasterxml.jackson.core</groupId>
 <artifactId>jackson-databind</artifactId>
 <version>2.7.1-1</version>
 </dependency>
 <dependency>
 <groupId>com.fasterxml.jackson.core</groupId>
 <artifactId>jackson-annotations</artifactId>
 <version>2.7.1</version>
 </dependency>
 <dependency>
 <groupId>org.json</groupId>
 <artifactId>json</artifactId>
 <version>20151123</version>
 </dependency>
 <dependency>
 <groupId>com.alibaba</groupId>
 <artifactId>fastjson</artifactId>
 <version>1.2.7</version>

這地方先貼出一部分，可能還有沒涉及到的依賴，到百度一查就好了，