DataTables initComplete 选项

DataTables 是 jQuery 插件，可用于为网页的 HTML 表格添加交互式和高级控件。这也允许根据用户的需要对表中的数据进行搜索、排序和过滤。 DataTable 还公开了一个强大的 API，可进一步用于修改数据的显示方式。

initComplete选项用于指定当 DataTable 完全加载所有数据时将调用的函数。在数据加载后可能需要以任何方式修改表的情况下，这可能是有用的信息。它具有 JSON 参数作为回调，该回调返回服务器返回的数据。

句法：

function initComplete( settings, json )

参数：此选项有两个参数，如上所述，如下所述：

• settings：这是 DataTable 的设置对象，包含初始化表时使用的所有设置。
• json：这是使用ajax选项时从服务器检索的 JSON 数据。不使用此选项时未定义。

下面的示例说明了此选项的使用。

示例 1：在此示例中，我们使用 initComplete 回调将表已初始化的日志记录到控制台。

HTML

  
  
  
  
  
  
  
  
  
  
  


  
    GeeksForGeeks
  
  DataTables initComplete Option
  
  
  
    
      
        
        
        
      
    
    
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
    
  DayNameAge2Patricia222Caleb471Abigail485Rahim445Sheila222Lance485Erin481Christopher282Roary352Astra37
  
  
    // Initialize the DataTable
    $(document).ready(function () {
      $('#tableID').DataTable({
  
        initComplete: function () {
          console.log("The Table has been initialized!")
        }
      });
    }); 
  

输出：

示例 2：在本示例中，我们使用回调来更改初始化后的表格颜色。

HTML

  
  
  
  
  
  
  
  
  
  
  


  
    GeeksForGeeks
  
  DataTables initComplete Option
  
  
  
    
      
        
        
        
      
    
    
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
    
  DayNameAge2Patricia222Caleb471Abigail485Rahim445Sheila222Lance485Erin481Christopher282Roary352Astra37
  
  
    // Initialize the DataTable
    $(document).ready(function () {
      $('#tableID').DataTable({
  
        initComplete: function (settings, json) {
            
          // Set the background color of the table
          // to green after the initialisation of the
          // table has completed
          $("#tableID, td, tr")
            .css("background-color", "lightgreen" );
  
          console.log(
            "The color of the table has changed!"
          )
        }
      });
    }); 
  

输出：