html中点击按钮将table内的数据下载,保存为excel文件到本地,后台由java实现,给我个完整示例,包含所需要的jar包
时间: 2024-12-03 08:31:29 浏览: 21
在HTML中,你可以通过JavaScript结合一些库(如js-xlsx或xlsx)来实现点击按钮将表格数据导出为Excel。在后台,你可以使用Java的Apache POI库来操作Excel文件。以下是一个简单的前端和后端整合示例:
**前端HTML + JavaScript (使用js-xlsx库):**
```html
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-xlsx/0.16.8/xlsx.full.min.js"></script>
</head>
<body>
<table id="dataTable">
<!-- 表格内容 -->
</table>
<button onclick="downloadData()">导出为Excel</button>
<script>
function downloadData() {
// 获取表格数据
var table = document.getElementById("dataTable");
var data = [];
for (var i = 0; i < table.rows.length; i++) {
var row = [];
for (var j = 0; j < table.rows[i].cells.length; j++) {
row.push(table.rows[i].cells[j].innerText);
}
data.push(row);
}
// 创建工作表和XLSX文件
const ws = XLSX.utils.table_to_sheet(data);
const wb = { SheetNames: ["Sheet1"], Sheets: { "Sheet1": ws } };
const excelFile = XLSX.write(wb, { type: 'binary' });
// 创建隐藏的a标签并下载文件
var a = document.createElement('a');
a.download = 'export.xlsx';
a.href = 'data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,' + btoa(excelFile);
a.click();
}
</script>
</body>
</html>
```
**后端Java (使用Apache POI库):**
首先,你需要引入Apache POI库,例如Maven依赖:
```xml
<dependency>
<groupId>org.apache.poi</groupId>
<artifactId>poi-ooxml</artifactId>
<version>5.0.0</version>
</dependency>
```
然后,在Java服务中创建Excel并写入数据:
```java
import org.apache.poi.xssf.usermodel.XSSFWorkbook;
public void exportToExcel(List<List<String>> data) throws IOException {
Workbook workbook = new XSSFWorkbook();
// 添加一个新的工作表
Sheet sheet = workbook.createSheet("Sheet1");
// 写入数据
int rowNum = 0;
for (List<String> rowData : data) {
Row row = sheet.createRow(rowNum++);
for (int colNum = 0; colNum < rowData.size(); colNum++) {
Cell cell = row.createCell(colNum);
cell.setCellValue(rowData.get(colNum));
}
}
try (OutputStream outputStream = response.getOutputStream()) {
workbook.write(outputStream);
outputStream.flush();
outputStream.close();
}
}
```
在前端触发下载的时候,你可以通过Ajax或其他方式调用这个Java方法并将生成的Excel流返回给前端。
阅读全文