intelogie / tableexport
This package is auto-updated.
Last update: 2024-09-21 19:47:34 UTC
README
TableExport
简单易实现的插件,可以将HTML表格导出为xlsx、xls、csv和txt文件
入门指南
下载和设置
要使用此插件,请在上一个HTML文档的<body>标签之前包含jQuery库、FileSaver.js脚本和TableExport.js插件
<script src="jquery.js"></script> <script src="filesaver.js"></script> ... <script src="tableexport.js"></script>
使用Bower安装
$ bower install tableexport.js
使用npm安装
$ npm install tableexport
CDNjs
依赖
必需
- jQuery (1.2.1或更高版本)
- FileSaver.js
可选/主题
- Bootstrap (3.1.0或更高版本)
附加组件
为了提供对 Office Open XML SpreadsheetML格式 (.xlsx) 的支持,您必须在FileSaver.js和TableExport.js之前将以下第三方脚本包含到您的项目中。
- SheetJS -> xlsx-core.js
<script src="xlsx-core.js"></script> <script src="filesaver.js"></script> ... <script src="tableexport.js"></script>
为了支持旧浏览器(Firefox<20、Opera<15、Safari<6),还必须在Blob.js之前包含FileSaver.js脚本。
<script src="xlsx-core.js"></script> <script src="blob.js"></script> <script src="filesaver.js"></script> ... <script src="tableexport.js"></script>
使用方法
CSS
默认情况下,TableExport.js利用Bootstrap CSS框架提供增强的表格和按钮样式。对于非Bootstrap项目,将bootstrap
属性设置为false
进行初始化。
$("table").tableExport({ bootstrap: false });
当与Bootstrap一起使用时,有四个自定义类 .xlsx、.xls、.csv、.txt,为每种可导出文件类型提供按钮样式。
JavaScript
要使用导出插件,只需调用
$("table").tableExport();
可以通过传递其他属性来自定义表格、按钮和导出数据的样式和感觉。
注意:默认情况下,TableExport将为三种不同的文件类型创建导出按钮 xls、csv、txt。您可以通过将formats
属性设置为所选文件类型来选择要生成的按钮。
/* Defaults */ $("table").tableExport({ headings: true, // (Boolean), display table headings (th/td elements) in the <thead> footers: true, // (Boolean), display table footers (th/td elements) in the <tfoot> formats: ["xls", "csv", "txt"], // (String[]), filetype(s) for the export fileName: "id", // (id, String), filename for the downloaded file bootstrap: true, // (Boolean), style buttons using bootstrap position: "bottom", // (top, bottom), position of the caption element relative to table ignoreRows: null, // (Number, Number[]), row indices to exclude from the exported file ignoreCols: null, // (Number, Number[]), column indices to exclude from the exported file ignoreCSS: ".tableexport-ignore" // (selector, selector[]), selector(s) to exclude from the exported file });
注意:要使用xlsx文件类型,您必须包含依赖部分中列出的第三方脚本。
TableExport支持创建后控制它的额外方法(update、reset和remove)。
/* Run plugin and save it to a variable */ var tables = $("table").tableExport();
/* update */ tables.update({ filename: "newFile" // pass in a new set of properties }); /* reset */ tables.reset(); // useful for a dynamically altered table /* remove */ tables.remove(); // removes caption and buttons
属性
有关可用属性及其用法的表格,请在此处查看
www.clarketravis.com/tableexport
方法
有关可用方法和其用法的表格,请在此处查看
www.clarketravis.com/tableexport
设置
每个按钮都分配了一个基于其各自文件类型和相应CSS样式的默认类和默认内容。
/* default class, content, and separator for each export type */ /* Excel Open XML spreadsheet (.xlsx) */ $.fn.tableExport.xlsx = { defaultClass: "xlsx", buttonContent: "Export to xlsx", mimeType: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", fileExtension: ".xlsx" }; /* Excel Binary spreadsheet (.xls) */ $.fn.tableExport.xls = { defaultClass: "xls", buttonContent: "Export to xls", separator: "\t", mimeType: "application/vnd.ms-excel", fileExtension: ".xls" }; /* Comma Separated Values (.csv) */ $.fn.tableExport.csv = { defaultClass: "csv", buttonContent: "Export to csv", separator: ",", mimeType: "application/csv", fileExtension: ".csv" }; /* Plain Text (.txt) */ $.fn.tableExport.txt = { defaultClass: "txt", buttonContent: "Export to txt", separator: " ", mimeType: "text/plain", fileExtension: ".txt" };
以下是一些额外的默认设置,以支持插件的功能。
/* default charset encoding (UTF-8) */ $.fn.tableExport.charset = "charset=utf-8"; /* default filename if "id" attribute is set and undefined */ $.fn.tableExport.defaultFileName = "myDownload"; /* default class to style buttons when not using bootstrap */ $.fn.tableExport.defaultButton = "button-default"; /* bootstrap classes used to style and position the export buttons */ $.fn.tableExport.bootstrap = ["btn", "btn-default", "btn-toolbar"]; /* row delimeter used in all filetypes */ $.fn.tableExport.rowDel = "\r\n";
浏览器支持
*需要第三方依赖项
实时演示
实时交互演示在此处
www.clarketravis.com/tableexport
许可证
TableExport.js 的授权条款遵循 MIT 许可协议
致谢
- John Resig - jQuery
- SheetJS - js-xlsx
- Eli Grey - FileSaver.js & Blob.js