问题描述
Index.PHP- 上传excel文件并在pre标签内显示json数据。
<!DOCTYPE html>
<html lang="fr">
<head>
<Meta charset="UTF-8">
<Meta name="viewport" content="width=device-width,initial-scale=1.0">
<Meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Budget</title>
<link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
<div class="col-sm-6 custom-file"> <!-- 2nd column -->
<div class="row">
<div class="col-sm-6">
<input class="form" type="file" id="fileUpload"> // upload .xlsx,.xls file
</div>
<div class="col-sm-6">
<button type="button" class="btn btn-outline-primary" id="uploadExcel">Convert</button>
</div>
</div>
<PRE id="jsonData"></PRE> <!-- display Json data of multiple sheets from workbook(budget_book.xls) -->
</div>
<script src="js/file.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.9/xlsx.full.min.js"></script>
</body>
</html>
file.js 用于上传excel文件并获取多个excel表数据并转换为Json
let rABS=true;
let input=document.getElementById('fileUpload');
let uploadExcel=document.getElementById('uploadExcel');
let jsonObject=[];
input.addEventListener('change',function(Event){
selectedFile=Event.target.files[0];
});
uploadExcel.addEventListener('click',()=>{
if(selectedFile){
console.log(selectedFile);
var reader = new FileReader();
if(rABS){reader.readAsBinaryString(selectedFile);}
else{reader.readAsArrayBuffer(selectedFile);}
/* reader.addEventListener('load',function() {
document.getElementById('jsonData').innerText = this.result;
}); */
reader.onload=(event)=>{
let data=event.target.result;
let workbook=XLSX.read(data,{type:rABS ?'binary':'array'});
let sheet_name_list=workbook.SheetNames;
console.log(sheet_name_list);
sheet_name_list.forEach(sheet => {
let worksheet=workbook.Sheets[sheet];
console.log(sheet);
let rowObject=XLSX.utils.sheet_to_row_object_array(worksheet);
jsonObject=JSON.stringify(rowObject,undefined,2);
document.getElementById('jsonData').innerHTML=jsonObject; // display multiple excel sheets data inside <pre> tag in index.PHP
});
};
}
});
在我的budget_book.xlsx 中有两张表（sheet1 和sheet2），但代码只显示最后一张表（即sheet2）
foreach 循环工作正常，因为它在控制台中显示了 2 个工作表，并且工作表 1 中的数据也显示在控制台日志中，但在内部显示了工作表 2（最后一个工作表）中的数据。
但在标签内部它不显示来自 Budget_Book.xls 的 sheet1 的数据
请为我提供此问题的解决方案，以显示两张工作表中的 Json 数据。是否有其他方法可以实现这一点，因为这也将受到欢迎。请仅提供纯 javascript 解决方案。
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）