Bulma
此范例展示 DataTables 与 Scroller 扩展一同使用,且由 Bulma 提供样式设定。DataTables/Bulma 整合可让 DataTables 无缝整合到 Bulma 页面中。
ID | 名字 | 姓氏 | 邮递区号/邮政编码 | 国家/地区 |
---|
- Javascript
- HTML
- CSS
- Ajax
- 服务器端脚本
- 备注
以下展示的 Javascript 用于初始化此范例中显示的表格
$('#example').DataTable({ ajax: '../data/2500.txt', scrollCollapse: true, scroller: true, scrollY: 200 });
new DataTable('#example', { ajax: '../data/2500.txt', scrollCollapse: true, scroller: true, scrollY: 200 });
除了上述代码之外,会加载以下 Javascript 函数库文件以供此范例使用
以下显示的 HTML 是原始的 HTML 表格元素,在经过 DataTables 增强之前
此范例除了加载自函数库文件(如下)的额外 CSS 之外,还会使用以下显示的额外 CSS 以正确呈现该表格
会加载以下 CSS 函数库文件以供此范例使用,以提供该表格的样式设定
此表格藉由 Ajax 加载数据。已加载的最新数据显示如下。当加载任何其他数据时,这些数据将自动更新。
以下显示适用于此表格执行服务器端处理所使用的脚本。请注意,这只是一个使用 PHP 的范例脚本。服务器端处理脚本可以使用任何语言撰写,并使用 DataTables 文件中说明的协定。