使用響應擴展獲取表中隱藏單元格的索引

Question

我建立了一個jQuery DataTables，並在其中一個單元格中帶有一個“ checking”類的按鈕，單擊此按鈕后，我想獲取包含該按鈕的單元格的索引。

為了達到這個目的，我一直在使用以下代碼：

$("#table tbody").on('click','.checking',function(){
    var index = '';
    index = $("#table").DataTable().cell($(this).parents('td')).index();
    console.log(index);
});

當單元尚未被DataTables的Responsive擴展隱藏時，此方法一直很好，但是，當該字段被隱藏時，此函數將引發undefined值。

請參見下面的屏幕截圖中的“開始”按鈕。

Answer 1

原因

當“響應擴展”隱藏一列時，默認情況下，它將所有內容放入一個td節點作為一個包含多個li節點的列表的單獨tr節點中。

當您的單元格變為隱藏時，由於不同的標記，代碼cell($(this).parents('td'))停止工作。

解

• 僅DataTables 1.10.11+和響應式2.0.2+

   $('#table tbody').on('click','.checking',function(){ var index = $('#table').DataTable().cell($(this).closest('td, li')).index(); console.log(index); }); 

  有關代碼和演示，請參見此jsFiddle 。

• 數據表1.10+和響應式1.0.3+

  此方法使用了不推薦使用的方法responsive.index() ，在將來的版本中可能會刪除該方法，不建議使用。

   $('#example tbody').on('click','.checking',function(){ var $cellNode = $(this).closest('td, li'); var cell; if($cellNode.is('td')){ cell = $('#example').DataTable().cell($cellNode); } else { var cellIdx = $('#example').DataTable().responsive.index($cellNode); cell = $('#example').DataTable().cell($cellNode); } var index = cell.index(); console.log(index); }); 

  有關代碼和演示，請參見此jsFiddle 。