jquery把页面<table>里的内容导出为后缀名为.xlsx的excel
要使用jQuery将表格内容导出为.xlsx
格式的Excel文件,可以使用FileSaver.js
和xlsx.js
(或xlsx.full.min.js
)这两个库。以下是实现这一功能的示例代码:
- 首先,在HTML页面中引入必要的JavaScript库:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.2/xlsx.full.min.js"></script>
- 接下来,编写导出功能的jQuery代码:
function exportTableToExcel(tableID, filename = ''){
var table = $('#' + tableID).clone();
table.find('td:last-child').remove(); // 移除最后一列(假设为操作列)
table.find('th:last-child').remove(); // 移除最后一列的表头
var ws = XLSX.utils.table_to_sheet(table[0]);
var wb = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(wb, ws, filename);
var wbout = XLSX.write(wb, {bookType: 'xlsx', type: 'binary'});
function s2ab(s) {
var buf = new ArrayBuffer(s.length);
var view = new Uint8Array(buf);
for (var i = 0; i < s.length; i++) view[i] = s.charCodeAt(i) & 0xFF;
return buf;
}
saveAs(new Blob([s2ab(wbout)], {type: 'application/octet-stream'}), filename + '.xlsx');
}
// 使用方法:
$(document).ready(function(){
$('#export-btn').click(function(){
exportTableToExcel('your-table-id', 'your-filename');
});
});
- 在HTML中添加一个按钮来触发导出操作:
<button id="export-btn">导出为Excel</button>
确保你的表格元素有一个ID,如上例中的your-table-id
,并且在调用exportTableToExcel
函数时将其作为第一个参数,同时可以指定一个文件名作为第二个参数。
请注意,上述代码假设表格中的最后一列是不需要导出的操作列,如果你的表格结构不同,请相应地修改代码。
评论已关闭