事件

有時候，知道 DataTables 或其擴充功能何時執行了特定操作 (例如頁面繪製)，以便更新其他相依的元素以考量變更，會很有用。為了提供此功能，DataTables 將觸發自訂 DOM 事件，可以使用 on() 方法或 jQuery 的 on() 方法來監聽並對其採取行動。DataTables 的自訂事件與標準 DOM 事件的運作方式完全相同，並允許事件驅動的操作，這對於外掛程式特別有用。

如需 DataTables 及其擴充功能會觸發的事件完整清單，請參閱事件參考文件。

監聽事件

如上所述，您可以使用 on() 或 jQuery 的 on() 方法來監聽事件。on() 的運作方式與 $().on() 完全相同，並提供命名空間和多個事件的功能。

請注意，所有 DataTables 事件都會以 dt 命名空間觸發。 事件的此命名空間是為了防止與其他 Javascript 函式庫觸發的自訂事件發生衝突。因此，您應該將 .dt 附加到您正在監聽的事件名稱 (當使用 on() 時，如果需要，會自動附加命名空間)。由於命名空間在 jQuery 中的運作方式，如果您希望使用命名空間，可以使用 dt 命名空間和您自己的自訂命名空間。

例如，要監聽 DataTable 中的繪製事件

var table = $('#example').DataTable();

table.on( 'draw', function () {
    alert( 'Table redrawn' );
} );

這也可以寫成

$('#example').on( 'draw.dt', function () {
    alert( 'Table redraw' );
} );

請注意，在使用 jQuery on() 方法時使用了 dt 命名空間，而 on() 方法會自動為您附加命名空間。

移除事件

與 $().on() 一樣，DataTables 事件可以使用 off() 和 $().off() 移除。從不再存在的物件中移除事件 (在它們被銷毀之前) 非常重要，以便讓 Javascript 引擎的垃圾回收器釋放為事件和它所附加的物件所配置的記憶體。

此外，可以使用 one() 或 $().one() 監聽單個事件，其中事件處理程序會在第一次觸發事件後立即移除。

冒泡

與典型的 DOM 事件一樣，DataTables 自訂事件會在文件中向上冒泡，因此您可以使用 $().on() 的委派形式或在 DOM 樹中較高的其他元素上監聽事件。

例如，這對於知道何時建立新的 DataTable 會很有用，可以使用 init 事件來監聽，如下所示

$(document).on( 'init.dt', function ( e, settings ) {
    var api = new $.fn.dataTable.Api( settings );

    console.log( 'New DataTable created:', api.table().node() );
} );

同樣地，此方法對於 xhr 事件也很有用，這會讓您知道從上次 DataTables 發起的 Ajax 查詢中，從伺服器返回了哪些 JSON 資料。

DataTables 及其擴充功能可以觸發的事件完整清單，請參閱事件參考文件。