滚动仪示例 基本初始化

Scroller是DataTables的插件,它增强了DataTables的内置滚动功能以允许 很快就会在页面上呈现大量数据。这是由滚动仪通过使用的 一种虚拟渲染技术,它将仅渲染实际所需的表的一部分 the current view.

请注意,滚动仪假定所有行都具有相同的高度(以便预成功所需的 calculations. You can use td { white-space: nowrap; } in your CSS to ensure that text in rows does not wrap.

此示例显示了可以通过简单地包括字符来初始化DataTables的滚动夹 S in sDom (note that the S must come after the t in sDom). 在此示例中也使用延迟渲染A和Ajax数据源。

ID 邮编/邮政编码 国家

下面显示的JavaScript用于初始化此中所示的表 example:

$(document).ready(function() { $('#example').DataTable( { ajax: "data/2500.txt", deferRender: true, dom: "frtiS", scrollY: 200, scrollCollapse: true } ); } );

除了上面的代码外,还加载了以下JavaScript库文件以供使用 example:

下面显示的HTML是RAW HTML表元素,然后才能增强 DataTables:

此示例使用超出库中加载的内容的一点额外CSS 文件(如下),以便正确显示该表。显示使用的附加CSS below:

在此示例中加载以下CSS库文件以提供造型 table:

此表由Ajax加载数据。已加载的最新数据如下所示。这个数据 将自动更新,因为加载了任何其他数据。

用于执行此表的服务器端处理的脚本如下所示。请注意 这只是使用PHP的示例脚本。服务器端处理脚本可以写入任何内容 language, using 该协议描述于 可列表文件.