Excel到JSON的JavaScript代码？
我想将excel表数据转换为json.它必须是动态的,因此有一个上传按钮,用户上传excel表格,然后将数据转换为json.你能提供我的javascript代码吗？我试过SheetJS,但无法弄清楚.我更喜欢直接的东西:)
我真的很感谢你的帮助!
Ang*_* 84 19
注意:不是100%交叉浏览器
因为你会看到人们对不太常见的浏览器有问题,但这可以归结为浏览器的版本..我总是建议使用像caniuse这样的东西来看看支持哪一代浏览器...这只是一个为用户工作的答案,而不是最终复制和粘贴代码供人们使用..
小提琴:http://jsfiddle.net/d2atnbrt/3/
HTML代码:
<input type="file" id="my_file_input" />
<div id='my_file_output'></div>
JS代码:
var oFileIn;
$(function() {
oFileIn = document.getElementById('my_file_input');
if(oFileIn.addEventListener) {
oFileIn.addEventListener('change', filePicked, false);
}
});
function filePicked(oEvent) {
// Get The File From The Input
var oFile = oEvent.target.files[0];
var sFilename = oFile.name;
// Create A File Reader HTML5
var reader = new FileReader();
// Ready The Event For When A File Gets Selected
reader.onload = function(e) {
var data = e.target.result;
var cfb = XLS.CFB.read(data, {type: 'binary'});
var wb = XLS.parse_xlscfb(cfb);
// Loop Over Each Sheet
wb.SheetNames.forEach(function(sheetName) {
// Obtain The Current Row As CSV
var sCSV = XLS.utils.make_csv(wb.Sheets[sheetName]);
var oJS = XLS.utils.sheet_to_row_object_array(wb.Sheets[sheetName]);
$("#my_file_output").html(sCSV);
console.log(oJS)
});
};
// Tell JS To Start Reading The File.. You could delay this if desired
reader.readAsBinaryString(oFile);
}
这也需要https://cdnjs.cloudflare.com/ajax/libs/xls/0.7.4-a/xls.js转换为可读格式,我还使用jquery只更改div内容和dom ready event ..所以不需要jquery
这是我能得到的基本要素,
编辑 - 生成表
小提琴:http://jsfiddle.net/d2atnbrt/5/
这第二个小提示显示了生成自己的表的示例,这里的关键是使用sheet_to_json以正确的格式获取JS使用的数据.
第二小提琴中的一两条评论可能不正确,因为第一小提琴的修改版本...... CSV评论至少是这样
测试XLS文件:http://www.whitehouse.gov/sites/default/files/omb/budget/fy2014/assets/receipts.xls
这不包括XLSX文件的思想,使用他们的示例调整它们应该相当容易.
- 我想我在这里给你的已经足够了，如果你在这里需要更多帮助，我会建议教程和一些基础知识。 (2认同)
小智 8
js-xlsx 库可以轻松地将 Excel/CSV 文件转换为 JSON 对象。
从这里下载 xlsx.full.min.js 文件。在您的 HTML 页面上编写以下代码编辑引用的 js 文件链接 (xlsx.full.min.js) 和 Excel 文件的链接
<!doctype html>
<html>
<head>
<title>Excel to JSON Demo</title>
<script src="xlsx.full.min.js"></script>
</head>
<body>
<script>
/* set up XMLHttpRequest */
var url = "http://myclassbook.org/wp-content/uploads/2017/12/Test.xlsx";
var oReq = new XMLHttpRequest();
oReq.open("GET", url, true);
oReq.responseType = "arraybuffer";
oReq.onload = function(e) {
var arraybuffer = oReq.response;
/* convert data to binary string */
var data = new Uint8Array(arraybuffer);
var arr = new Array();
for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
var bstr = arr.join("");
/* Call XLSX */
var workbook = XLSX.read(bstr, {
type: "binary"
});
/* DO SOMETHING WITH workbook HERE */
var first_sheet_name = workbook.SheetNames[0];
/* Get worksheet */
var worksheet = workbook.Sheets[first_sheet_name];
console.log(XLSX.utils.sheet_to_json(worksheet, {
raw: true
}));
}
oReq.send();
</script>
</body>
</html>
输入：
输出：
答案适用于 xls 格式，但就我而言，它不适用于 xlsx 格式。因此我在这里添加了一些代码。它适用于 xls 和 xlsx 格式。
希望它可以帮助！
function fileReader(oEvent) {
var oFile = oEvent.target.files[0];
var sFilename = oFile.name;
var reader = new FileReader();
var result = {};
reader.onload = function (e) {
var data = e.target.result;
data = new Uint8Array(data);
var workbook = XLSX.read(data, {type: 'array'});
console.log(workbook);
var result = {};
workbook.SheetNames.forEach(function (sheetName) {
var roa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetName], {header: 1});
if (roa.length) result[sheetName] = roa;
});
// see the result, caution: it works after reader event is done.
console.log(result);
};
reader.readAsArrayBuffer(oFile);
}
// Add your id of "File Input"
$('#fileUpload').change(function(ev) {
// Do something
fileReader(ev);
}