前言:最近在作一個WEB後臺,無心中發現這個插件,試用了一下以爲不錯,但網上關於它的資料大多不全,因此利用一些時間將其API文檔翻了一下,發在園子裏供你們參考。(p.s:我的E文水平不好,對着靈格斯翻出來,確定有不少不對的地方,歡迎指正,但請勿噴。)css
方法或屬性名
|
參數說明
|
返回值類型 |
功能描述
|
應用示例
|
version
|
無
|
string
|
主要供插件開發者使用,用於檢測兼容性。其輸出格式爲:a.b.c.d.e。其中abc均爲整數,d爲描述字符串(dev或beta),e也是一個整數,d和e爲可選項。 |
$.fn.dataTable.version
|
方法或屬性名
|
參數說明
|
返回值類型 |
功能描述
|
應用示例
|
|
$(sSelector, oOpts) | 一、sSelector(字符串或節點名或jquery選擇字符串),指定要選取的行 二、oOpts(js對象,可選),對選擇器的範圍進行再限制,即sSelector只在這個對象規定的範圍中選取。有三個可選參數: (1)filter(應用過濾):字符串,默認值爲「none",即不該用。只在被當前應用在table中的過濾器過濾之後的行中選擇,若是當前table沒有應用過濾器,即便設置了filter:"applied"也會在全部行中查找。 (2)order:字符串,默認值爲」current"。這個參數默認影響返回數組中TR元素的排序。"current"表示按照表當前正在使用的索引列進行排序,"original"表示按照表最初讀取數據時使用的索引列進行排序。 (3)page:限制選擇是否僅限於當前顯示的頁面。"current"表示僅限於當前頁,"all"表示全部頁。若是此項被設置爲"current",則order會被假設爲"current",filter爲"applied",也就是說即便手動給這兩個參數設置了不一樣的值也會被忽略。 |
jquery對象 | 使用一個jquery選擇器從表的TR(包含在tbody中的TR)元素中查找符合條件的行的集合(jquery對象) | oTable.$('tr:odd').css('backgroundColor', 'blue'); oTable.$('tr:odd', { order: "current",page:"current" }).css('backgroundColor', 'blue'); |
|
_(sSelector, oOpts) |
同上
|
匹配元素中包含的數據,若是選擇器匹配元素包含非TR、TD或者TH元素,則返回數組對應位置會是一個空條目。 | 使用方式基本同上面的$同樣,但它返回的是全部匹配行的數據--也就是說,sSelector的匹配目標應該是TR行或者是TD/TH單元格而不是其它的元素,由於只有這些行/單元格才包含數據。若是找到匹配的行,返回的數據將是生成該行的原始數據(數組或對象),若是原始數據源來自於DOM,則返回一個通用數組。 這個方法一般和$方法一塊兒配合使用,經過向兩個方法給定一樣的參數,能夠保證返回數組中(行集合/數組)索引可以互相匹配。 注:按照說明的意思,這個方法應該能夠獲取單元格的數據,但實際經過測試只能獲取首行的單元格數據,像"tr:eq(2) td:eq(1)"這樣的選擇器返回的是undefined |
|
|
fnAddData(mData, bRedraw) |
一、mData:數組或者對象,必選項。表示要添加到表中的數據,能夠是如下四種類型之一:
(1)一維數據數組,表示單行
(2)2維數據數組,表示多行
(3)單個對象,和初始化時定義的mData相對應的數據對象,表示單行
(4)對象數組,同上,表示多行
二、bRedraw:布爾值,可選,默認true,指示是否當即重繪表格。
|
一個整數數組,表示各條新增數據在內置的aoData數組中的索引位置。
|
向表中添加一行或多行數據,注意這個方法僅對處理客戶端數據有效(數據來自於客戶端腳本對象、數組或DOM,或者初始化時指定了sAjaxSource但沒有指定"bServerSide": true),若是數據源指定的是「通過服務端處理」(初始化時指定了"bServerSide": true)的話,要向表中添加新數據,須要先調用一個Ajax方法將數據添加到數據源中,也就是服務端,再由服務端將數據返回給表。
|
oTable.fnAddData([[16, "張三", 55, "男", "1982/12/1"], [54, "李四", 55, "男", "1982/12/1"], [88, "王五", 55, "男", "1982/12/1"]]);
|
|
fnAdjustColumnSizing(bRedraw) |
一、Bredraw:布爾值,可選,默認true,表示是否重繪表。
|
無
|
調用這個方法會使得DataTable根據所包含的數據長度和開發者給列指定的長度(樣式表、DOM中直接指定、或者初始化時指定了sWidth參數)從新計算列寬,並調整表格的顯示,這個方法在表的父容器大小發生變化時至關有用(好比瀏覽器窗口大小變化)。
|
|
|
fnClearTable(bRedraw) |
一、bRedraw:布爾值,可選,默認爲true,表示是否當即重繪表格。
|
無
|
快速、直接的清除表中全部數據行。若是bRedraw爲false,屏幕顯示不會發生變化,但像$、_方法已經取不到值了。
|
oTable.fnClearTable(false);
|
|
fnClose(nTr) |
一、nTr,html node(也就是TR),表明要被「close」的行。
|
成功返回0,失敗返回1(未找到匹配的行)
|
只針對狀態爲「open"的行,功能是關閉當前狀態爲「open"的行。
|
$('#example tbody tr').click( function () {
if ( oTable.fnIsOpen(this) ) {
oTable.fnClose( this );
} else {
oTable.fnOpen( this, "Temporary row opened", "info_row" );
}
} );
|
|
fnDeleteRow(mTarget, fnCallBack, bRedraw) |
一、mTarget:混合型,能夠是被刪除行在aoData中的索引,也能夠是要刪除的TR元素(用jqury選擇器表示)。
二、fnCallBack:函數或者null,可選,回調函數。刪除動做開始時調用,傳遞給此函數的參數有兩個,第一個是一個包含當前表全部初始化信息的對象,第二個是將要被刪除行的數據數組。
三、bRedraw:布爾值,可選,默認true。是否重繪表格。
|
被刪除的行。
|
刪除表中某行。
|
oTable.fnDeleteRow( 0 );
|
|
fnDestroy(bRemove) |
一、bRemove:布爾值,可選,默認false。表示是否徹底刪除該表。若是爲true,則連原始DOM也會被刪除。
|
無
|
將表恢復爲原始定義的html DOM結構,移除應用到table上的樣式和事件監聽。
|
|
|
fnDraw(bComplete) | 一、bComplete:布爾值,可選,默認true。表示在重繪以前是否對錶進行從新過濾和從新排序。 |
無
|
重繪表。
|
|
|
fnFilter(sInput, iColumn, bRegex, bSmart, bShowGlobal, bCaseInsensitive) |
一、sInput:字符串,必選,指定要過濾顯示的某列數據的所有或一部分。
二、iColumn,整數或null,可選,指定sInput要匹配的列,從0開始。
三、bRegex,布爾值,可選,默認爲false,是否將sInput視爲正則表達式。
四、bSmart,布爾值,可選,默認爲true,是否開啓智能搜索。(這個API說明有點坑,也沒有示例,經過研究跟蹤源碼才搞明白,若是爲true,則若是sInput包含有空格字符,則會以空格爲界將其拆分爲數組,搜索同時包含數組中每一個字符串的行,對應數據能夠是一列的內容,也能夠不在一列中,若是爲false,則將空格視爲欲搜索字符)
五、bShowGlobal:布爾值,可選,默認true,是否在表附帶的搜索輸入框中顯示sInput的內容。
六、bCaseInsensitive:布爾值,可選,默認true,是否不區分大小寫
|
無
|
對錶中數據進行過濾。 |
|
|
fnGetData(mRow, iCol) |
一、mRow:整數或tr/td/th節點。可選,若是指定一個tr節點則從數據源返回整行的數據,若是指定的是td/th則返回相應單元格中的數據。若是是一個整數,會把這個整數視內部數組aoData的索引,返回對應的數據。
二、iCol:整數,可選,指定列序號。
|
若是無參調用,則返回全表數據;指定了mRow,返回對應行的數據;指定了iCol,返回對應單元格的數據。
|
獲取表的所有數據,若是指定了行和列則返回對應行或列的數據
|
|
|
fnGetNodes(iRow) |
一、iRow:整數,可選,指定要獲取行在表中的序號。這個序號不是顯示出來的行序,而數據在aoData中的序號。
|
無參調用返回包含全部TR元素的數組,指定了iRow,只返回對應行的TR。
|
獲取一個body中包含的TR節點元素數組。 |
|
|
fnGetPosition(nNode) |
一、nNdoe:node,能夠是body中的TR、TD、TH元素。
|
若是nNode是TR,則返回該行在表中的顯示序號,即便順序發生了變化,它返回的仍是最初的序號;若是nNode是單元格,返回一個數組:[行序,可見列序,所有列序]。
|
返回特定單元格在表中的顯示位置,以數字表示,從0開始,詳見返回值說明。
|
|
|
fnIsOpen(nTr) |
一、nNode:node,要檢查的行(html dom)。
|
當前行狀態爲open,則返回true,不然返回false。
|
檢查行的狀態是否爲open。
|
|
|
fnOpen(nTr, mHtml, sClass) |
一、nTr:node,被打開(open)的行。
二、mHtml:string\node\jquery,打開行後添加的html內容。
三、sClass:string,設置新添加的單元格的樣式(由於它實際生成的是一個新行,包含一個td來放置mHtml的內容)
|
打開後的添加的新行,若是未找到匹配行,返回undefined。 |
在當前頁面指定行下面添加一個新行並顯示指定的mHtml內容。
|
|
|
fnPageChange(mAction, bRedraw) |
一、mAction:string/int。可取值爲:「first","previous","next","last",或者是要跳轉到的頁碼,注意0表明第1頁。
二、bRedraw:bool,可選,默認true,是否重繪表格。
|
無
|
翻頁。
|
|
|
fnSetColumnVis(iCol, bShow, bRedraw) |
一、iCol:int,被顯示或隱藏的列序號,從0開始。
二、bShow:bool,true爲顯示,false爲隱藏。
三、bRedraw:bool,可選,默認爲true,是否重繪。
|
無
|
顯示或隱藏指定列。
|
|
|
fnSettings() | 無 |
指定表的配置對象
|
獲取指定表的配置對象。 |
|
|
fnSort(iCol) |
一、iCol:int,列索引。
|
無
|
按照指定列對錶進行排序。
|
|
|
fnSortListener(nNode, iColumn, fnCallback) |
一、nNode:node,要添加監聽程序的元素
二、iColumn:int,指定的索引列
三、fnCallback:function,可選,回調函數
|
無
|
給某個元素添加對應特定列的監聽處理程序。(這個方法暫時尚未理解)
|
|
|
fnUpdate(mData, mRow, iColumn, bRedraw, bAction) |
一、mData:object/array/string,更新數據
二、mRow:node/int,被更新的TR元素或數組在aoData中索引。
三、iColumn:int,可選,要更新的列。和mRow一塊兒便可肯定單元格位置。
四、bRedraw:bool,可選,默認true,是否重繪表格。
五、bAction:bool,可選,默認true,是否執行預重繪動做。
|
成功返回0,錯誤返回1
|
更新錶行或單元格數據,該方法既能夠接受單一值,也能夠接受數組或對象
|
|
|
fnVersionCheck(sVersion) |
一、sVersion:string,版本號,能夠是X.Y.Z格式,也能夠接受X或X.Y格式。
|
大於等於指定版本號返回true,不然返回false。
|
對比當前DataTable的版本號。
|
|
方法或屬性名
|
參數說明
|
返回值類型
|
功能描述
|
應用示例
|
fnIsDataTable(nTable) |
nTable,node,被檢查的table元素。
|
是DataTable表返回true,不然返回false.
|
檢查指定指定table元素是否爲DataTable表。 |
|
fnTables(bVisible) |
bVisible:bool,可選,默認false,是否包含被隱藏表。
|
table node數組(注意不是DataTable實例)
|
獲取全部已經初始化的DataTable表。 |
|
fnVersionCheck(sVersion) |
|
|
同實例方法。
|
|
事件名稱
|
傳入參數
|
描述
|
destroy |
一、e,event,jquery事件對象
二、o:object,DataTable設置對象
|
DataTable銷燬事件,調用fnDestroy時觸發。
|
draw
|
同上
|
頁面中表重繪時觸發。也能夠給fnDrawCallback指定回調函數來綁定此事件。
|
filter
|
同上
|
應用到表的過濾條件發生改變時觸發。 |
init
|
一、2同上
三、json,對象,從服務端獲取的JSON對象。
|
DataTable初始化完成事件,當表完成渲染、裝載數據後觸發。 |
page
|
一、2同上
|
頁面改變事件,當表的當前分頁發生變化是觸發 |
processing
|
一、2同上
三、bShow:boolean,DataTable是否正在執行動做標記
|
正在處理事件,(未測試成功,如下內容爲我的理解),當DataTalbe執行一些比較耗時的動做時觸發(如排序、過濾)。能夠用來通知用戶DataTable正在執行某個動做,或者某個操做已經完成。
|
sort
|
一、2同上
|
排序事件,表的排序條件發生變化時觸發。 |
stateLoaded
|
一、2同上
三、json:object,保存在客戶端的狀態信息。
|
狀態載入完成事件。當狀態信息已經從本地存儲中載入同時配置對象內容也按照載入數據修改完成時觸發。
|
stateLoadParams |
同上
|
狀態載入時事件。
當狀態信息已經從本地存儲中載入但配置對象內容還未按照載入數據修改時觸發。
|
stateSaveParams | 一、2同上 三、json:object,將要被保存的狀態信息。 |
狀態保存事件,當表的狀態發生變化,須要從新保存狀態信息時觸發。
|
xhr
|
一、2同上
三、json:object,從服務端返回的JSON對象。
|
Ajax事件,當一個服務端Ajax請求完成時觸發(注意,這個事件處理程序由fnServerData調用,若是改寫了
fnServerData,須要在你本身的success函數中手動觸發這個事件)。
|