数据表 scrollY 选项

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

scrollY选项用于指定是否应在 DataTable 中启用垂直滚动。此选项将 DataTable 的高度限制为给定值，并允许用户滚动表本身中的任何溢出内容。这可用于需要在有限空间内放置多个表的情况。高度值可以在任何 CSS 单位中给出，也可以被视为像素值的数字。

句法：

{ scrollY: value }

选项值：此选项具有如上所述和如下所述的单个值：

• value：这是一个字符串值，用于指定 DataTable 的高度并启用垂直滚动。 默认值为空字符串。

以下示例说明了此选项的用法。

示例 1：此示例启用 DataTable 的垂直滚动。

HTML

  
  
  
  
  
  
  
  
  
  

  

  
    GeeksForGeeks
  
  DataTables scrollY Option
  
  
  
    
      
        
        
        
      
    
    
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
    
  IDNameAge1Sam352Sam303Sameer454Rob45Robber686Mikasa257Eren238Jean359Walter6510Jessie2811Gabi2012Tim3013Max35
  
  
    // Initialize the DataTable
    $(document).ready(function () {
      $('#tableID').DataTable({
  
        // Enable the vertical scrolling
        // of data in DataTable to 160px
        scrollY: "160px",
  
        // Disable the paging and
        // allow collapsing of the
        // table when data is less
        paging: false,
        scrollCollapse: true
      });
    }); 
  

输出：

示例 2：此示例禁用 DataTable 的垂直滚动。

HTML

  
  
  
  
  
  
  
  
  
  


  
    GeeksForGeeks
  
  DataTables scrollY Option
  
  
  
    
      
        
        
        
      
    
    
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
      
        
        
        
      
    
  IDNameAge1Sam352Sam303Sameer454Rob45Robber686Mikasa257Eren238Jean359Walter6510Jessie2811Gabi2012Tim3013Max35
  
  
    // Initialize the DataTable
    $(document).ready(function () {
      $('#tableID').DataTable({
  
        // Disable the vertical scrolling
        // of data in DataTable
        scrollY: "",
  
        // Disable the paging
        paging: false,
      });
    }); 
  

输出：