轉 Datatables中文API——基本參數

鑒於自己一直在使用datatables，發現這是個很不錯的表格外掛程式，但是好的東西都是英文的，所以我結合自己的使用經驗，把官網的英文api做下簡單的翻譯，同時也希望大家把自己的使用經驗一起分享出來，讓我們更好的使用datatables，本帖將會持續更新……
從基本屬性開始吧
bAutoWidth ：啟用或禁用自動列寬度的計算。

預設值	true
類型	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bAutoWidth": false  //關閉後，表格將不會自動計算表格大小，在瀏覽器大化小化的時候會擠在一坨
4.     } );
5. } );

複製代碼

bDeferRender ：根據官網的介紹翻譯過來就是，延期渲染，可以有個速度的提升，當datatable 使用Ajax或者JS源表的資料。這個選項設定為true,將導致datatable延遲建立表元素每個元素,直到他們都建立完成——本參數的目的是節省大量的時間。

預設值：	false
類型：	boolean

1. $(document).ready( function() {
2.     var oTable = $('#example').dataTable( {
3.         "sAjaxSource": "sources/arrays.txt",
4.         "bDeferRender": true   //這個參數我個人沒有使用過，到底是不是這個效果，大家自己去嘗試一下
5.     } );
6. } );

複製代碼

bFilter
：這個很容易明白，啟用或禁用過濾資料。在datatable過濾是“智能”,它允許使用者
最終輸入多個關鍵字(空格分隔)，和每一行資料匹配,即使不是在被指定的順序(這允許匹配多個列)。注意,如果您希望使用過濾，在datatable中必
須設定為true，如果要刪除預設過濾輸入框和留住過濾功能,請使用{ @link DataTable.defaults.sDom
}。這個最後一句不明白，不知道大家怎麼理解。

預設值：	true
類型：	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bFilter": false
4.     } );
5. } );

複製代碼

bJQueryUI ：這個不用多說了，一看就懂，啟用jQuery UI樣式，(需要在頁面添加jQuery的樣式檔案)。

預設值：	false
類型：	boolean

1. $(document).ready( function() {
2.     $('#example').dataTable( {
3.        "bJQueryUI": true
4.     } );
5. } );

複製代碼

bLengthChange ：開啟一頁顯示多少條資料的下拉式功能表，允許使用者從下拉框(10、25、50和100)，注意需要分頁(bPaginate：true)。

預設值：	true
類型：	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bLengthChange": false,

複製代碼

bPaginate ：開啟分頁功能，如果不開啟，將會全部顯示

預設值：	true
類型：	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bPaginate": false   
4.     } );
5. } );

複製代碼

bProcessing ：開啟讀取伺服器資料時顯示正在載入中……特別是大資料量的時候，開啟此功能比較好

預設值：	false
類型:	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bProcessing": true
4.     } );
5. } );

複製代碼

bScrollInfinite ：是否開啟不限制長度的捲軸（和sScrollY屬性結合使用），不限制長度的捲軸意味著當使用者拖動捲軸的時候DataTable會不斷載入資料當資料集十分大的時候會有些用處，該選項無法和分頁選項同時使用，分頁選項會被自動禁止，注意，額外推薦的捲軸會優先與該選項

預設值：	false
類型：	boolean

1. $(document).ready( function() {
2.     $('#example').dataTable( {
3.         "bScrollInfinite": true,
4.         "bScrollCollapse": true,
5.         "sScrollY": "200px"//長200像素
6.     } );
7. } );

複製代碼

bServerSide

：開啟伺服器模式，使用伺服器端處理配置datatable。注意：sAjaxSource參數也必須被給予為了給datatable原始碼來擷取所需的
資料對於每個畫。 這個翻譯有點彆扭。開啟此模式後，你對datatables的每個操作
每頁顯示多少條記錄、下一頁、上一頁、排序（表頭）、搜尋，這些都會傳給伺服器相應的值。

預設值：	false
類型：	boolean

1. $(document).ready( function () {
2.       $('#example').dataTable( {
3.           "bServerSide": true,
4.           "sAjaxSource": "xhr.php"
5.        } );
6. } );

複製代碼

bInfo ：啟用或禁用表資訊顯示。這顯示了關於資料的資訊,目前在網頁上,包括資訊過濾資料,如果行為被執行。這個參數在bServerSide配置後需要用到。

預設值：	true
類型：	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.        "bInfo": false//如果這個參數不穿到後台去，伺服器分頁會報錯，據說這個參數包含了表的所有資訊
4.     } );
5. } );

複製代碼

bSort ：開啟排序功能，每一列都有排序功能，如果關閉了，排序功能將失效，也可以自訂排序功能。單個列的排序可以禁用“bSortable”選項。

預設值：	true
類型：	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bSort": false
4.     } );
5. } );

複製代碼

bSortClasses ：是否在當前被排序的列上額外添加sorting_1,sorting_2,sorting_3三個class，當該列被排序的時候，可以切換其背景顏色，該選項作為一個來回切換的屬性會增加執行時間（當class被移除和添加的時候），當對大資料集進行排序的時候你或許希望關閉該選項

預設值：	true
類型：	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bSortClasses": false
4.      } );
5. } );

複製代碼

bStateSave ：是否開啟狀態儲存，當選項開啟的時候會使用一個cookie儲存表格展示的資訊的狀態，例如分頁資訊，展示長度，過濾和排序等。這樣當終端使用者重新載入這個頁面的時候可以使用以前的設定

預設值：	false
類型：	boolean

1. $(document).ready( function () {
2.     $('#example').dataTable( {
3.         "bStateSave": true
4.     } );
5. } );

複製代碼

sScrollX ：是否開啟水平滾動，當一個表格過於寬以至於無法放入一個布局的時候，或者表格有太多列的時候，你可以開啟該選項從而在一個可橫向滾動的視圖裡面展示表格，該屬性可以是css設定，或者一個數字（作為像素量度來使用）

預設值：	blank string - i.e. disabled
類型：	string

1. $(document).ready( function() {
2.     $('#example').dataTable( {
3.         "sScrollX": "100%",
4.         "bScrollCollapse": true
5.      } );
6. } );

複製代碼

sScrollY：是否開啟垂直滾動，垂直滾動會驅使DataTable設定為給定的長度，任何溢出到當前視圖之外的資料可以通過垂直滾動進行察看當在小範圍地區中顯示大量資料的時候，可以在分頁和垂直滾動中選擇一種方式，該屬性可以是css設定，或者一個數字（作為像素量度來使用）

預設值：	blank string - i.e. disabled
類型：	string

1. $(document).ready( function() {
2.     $('#example').dataTable( {
3.         "sScrollY": "200px",
4.         "bPaginate": false
5.      } );
6. } );

複製代碼

本節完畢，推薦是用ctrl+f尋找使用

收藏供查：原文地址：http://bbs.sailit.cn/forum.php?mod=viewthread&tid=21