打印按钮
此简单示例展示了仅使用 print
按钮类型配置的按钮。打印按钮将在最终用户的浏览器中打开一个新窗口,并且默认情况下会自动触发打印功能,允许最终用户打印表格。打印完成后或取消打印后,窗口将关闭。
姓名 | 职位 | 办公室 | 年龄 | 开始日期 | 薪资 |
---|---|---|---|---|---|
Tiger Nixon | 系统架构师 | 爱丁堡 | 61 | 2011-04-25 | $320,800 |
Garrett Winters | 会计 | 东京 | 63 | 2011-07-25 | $170,750 |
Ashton Cox | 初级技术作者 | 旧金山 | 66 | 2009-01-12 | $86,000 |
Cedric Kelly | 高级 Javascript 开发人员 | 爱丁堡 | 22 | 2012-03-29 | $433,060 |
Airi Satou | 会计 | 东京 | 33 | 2008-11-28 | $162,700 |
Brielle Williamson | 集成专家 | 纽约 | 61 | 2012-12-02 | $372,000 |
Herrod Chandler | 销售助理 | 旧金山 | 59 | 2012-08-06 | $137,500 |
Rhona Davidson | 集成专家 | 东京 | 55 | 2010-10-14 | $327,900 |
Colleen Hurst | Javascript 开发人员 | 旧金山 | 39 | 2009-09-15 | $205,500 |
Sonya Frost | 软件工程师 | 爱丁堡 | 23 | 2008-12-13 | $103,600 |
Jena Gaines | 办公室经理 | 伦敦 | 30 | 2008-12-19 | $90,560 |
Quinn Flynn | 支持主管 | 爱丁堡 | 22 | 2013-03-03 | $342,000 |
Charde Marshall | 区域总监 | 旧金山 | 36 | 2008-10-16 | $470,600 |
Haley Kennedy | 高级市场设计师 | 伦敦 | 43 | 2012-12-18 | $313,500 |
Tatyana Fitzpatrick | 区域总监 | 伦敦 | 19 | 2010-03-17 | $385,750 |
Michael Silva | 市场设计师 | 伦敦 | 66 | 2012-11-27 | $198,500 |
Paul Byrd | 首席财务官 (CFO) | 纽约 | 64 | 2010-06-09 | $725,000 |
Gloria Little | 系统管理员 | 纽约 | 59 | 2009-04-10 | $237,500 |
Bradley Greer | 软件工程师 | 伦敦 | 41 | 2012-10-13 | $132,000 |
Dai Rios | 人事主管 | 爱丁堡 | 35 | 2012-09-26 | $217,500 |
Jenette Caldwell | 开发主管 | 纽约 | 30 | 2011-09-03 | $345,000 |
Yuri Berry | 首席营销官 (CMO) | 纽约 | 40 | 2009-06-25 | $675,000 |
Caesar Vance | 售前支持 | 纽约 | 21 | 2011-12-12 | $106,450 |
Doris Wilder | 销售助理 | 悉尼 | 23 | 2010-09-20 | $85,600 |
Angelica Ramos | 首席执行官 (CEO) | 伦敦 | 47 | 2009-10-09 | $1,200,000 |
Gavin Joyce | 开发人员 | 爱丁堡 | 42 | 2010-12-22 | $92,575 |
Jennifer Chang | 区域总监 | 新加坡 | 28 | 2010-11-14 | $357,650 |
Brenden Wagner | 软件工程师 | 旧金山 | 28 | 2011-06-07 | $206,850 |
Fiona Green | 首席运营官 (COO) | 旧金山 | 48 | 2010-03-11 | $850,000 |
Shou Itou | 区域市场 | 东京 | 20 | 2011-08-14 | $163,000 |
Michelle House | 集成专家 | 悉尼 | 37 | 2011-06-02 | $95,400 |
Suki Burks | 开发人员 | 伦敦 | 53 | 2009-10-22 | $114,500 |
Prescott Bartlett | 技术作者 | 伦敦 | 27 | 2011-05-07 | $145,000 |
Gavin Cortez | 团队领导 | 旧金山 | 22 | 2008-10-26 | $235,500 |
Martena Mccray | 售后支持 | 爱丁堡 | 46 | 2011-03-09 | $324,050 |
Unity Butler | 市场设计师 | 旧金山 | 47 | 2009-12-09 | $85,675 |
Howard Hatfield | 办公室经理 | 旧金山 | 51 | 2008-12-16 | $164,500 |
Hope Fuentes | 秘书 | 旧金山 | 41 | 2010-02-12 | $109,850 |
Vivian Harrell | 财务总监 | 旧金山 | 62 | 2009-02-14 | $452,500 |
Timothy Mooney | 办公室经理 | 伦敦 | 37 | 2008-12-11 | $136,200 |
Jackson Bradshaw | 总监 | 纽约 | 65 | 2008-09-26 | $645,750 |
Olivia Liang | 支持工程师 | 新加坡 | 64 | 2011-02-03 | $234,500 |
Bruno Nash | 软件工程师 | 伦敦 | 38 | 2011-05-03 | $163,500 |
Sakura Yamamoto | 支持工程师 | 东京 | 37 | 2009-08-19 | $139,575 |
Thor Walton | 开发人员 | 纽约 | 61 | 2013-08-11 | $98,540 |
Finn Camacho | 支持工程师 | 旧金山 | 47 | 2009-07-07 | $87,500 |
Serge Baldwin | 数据协调员 | 新加坡 | 64 | 2012-04-09 | $138,575 |
Zenaida Frank | 软件工程师 | 纽约 | 63 | 2010-01-04 | $125,250 |
Zorita Serrano | 软件工程师 | 旧金山 | 56 | 2012-06-01 | $115,000 |
Jennifer Acosta | 初级 Javascript 开发人员 | 爱丁堡 | 43 | 2013-02-01 | $75,650 |
Cara Stevens | 销售助理 | 纽约 | 46 | 2011-12-06 | $145,600 |
Hermione Butler | 区域总监 | 伦敦 | 47 | 2011-03-21 | $356,250 |
Lael Greer | 系统管理员 | 伦敦 | 21 | 2009-02-27 | $103,500 |
Jonas Alexander | 开发人员 | 旧金山 | 30 | 2010-07-14 | $86,500 |
Shad Decker | 区域总监 | 爱丁堡 | 51 | 2008-11-13 | $183,000 |
Michael Bruce | Javascript 开发人员 | 新加坡 | 29 | 2011-06-27 | $183,000 |
Donna Snider | 客户支持 | 纽约 | 27 | 2011-01-25 | $112,000 |
姓名 | 职位 | 办公室 | 年龄 | 开始日期 | 薪资 |
- Javascript
- HTML
- CSS
- Ajax
- 服务器端脚本
- 评论 (0)
下面显示的 Javascript 用于初始化此示例中显示的表格
1 | $( '#example' ).DataTable({ layout: { topStart: { buttons: [ 'print' ] } } }); |
1 | new DataTable( '#example' , { layout: { topStart: { buttons: [ 'print' ] } } }); |
除了以上代码外,以下 Javascript 库文件也加载到此示例中以供使用
下面显示的 HTML 是原始 HTML 表格元素,在 DataTables 增强它之前
此示例使用了一些超出库文件(如下)加载的额外 CSS,以便正确显示表格。下面显示了使用的额外 CSS
1 |
以下 CSS 库文件加载到此示例中以提供表格的样式
此表格通过 Ajax 加载数据。已加载的最新数据显示如下。随着任何其他数据的加载,此数据将自动更新。
用于执行此表格的服务器端处理的脚本显示如下。请注意,这只是一个使用 PHP 的示例脚本。服务器端处理脚本可以用任何语言编写,使用 DataTables 文档中描述的协议。
Post new comment
Contributions in the form of tips, code snippets and suggestions for the above material are very welcome. To post a comment, please use the form below. Text is formatted by Markdown.
To post comments, please sign in to your DataTables account, or register:
Any questions posted here will be deleted without being published.
Please post questions in the Forums. Comments are moderated.