在前端开发中，可能会遇到前端如何读取Excel文件的数据的需求，(省略一千字。。。)。废话少说，直接上代码。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="js/jquery.js"></script> <script src="js/xlsx.core.min.js"></script> <title>上传excel文件并读取数据</title> </head> <body> <input type="file" id="file"> <div id="container" style="width: 400px; height: 400px;"></div> <script> $(\'#file\').change(function (e) { var files = e.target.files; var fileReader = new FileReader(); // 将文件内容读入内存 fileReader.onload = function (ev) { // 当读取操作成功完成时调用 // console.log(this.result); // 查看文件输出内容 try { var data = ev.target.result, //以二进制流方式读取得到表格中数据 workbook = XLSX.read(data, { type: \'binary\' }), info = [];//存储获取到的数据 } catch (e) { alert(\'文件类型不正确\'); return; } var fromTo = \'\'; //遍历每张表读取 for (var sheet in workbook.Sheets) { if (workbook.Sheets.hasOwnProperty(sheet)) { fromTo = workbook.Sheets[sheet][\'!ref\']; info = info.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet])); } } }; //以二进制方式打开文件 fileReader.readAsBinaryString(files[0]); }); </script> </body> </html>
说明：
1. jquery.js的下载地址：http://www.bootcdn.cn/jquery/
2. xlsx.core.min.js的下载地址：https://github.com/SheetJS/js-xlsx/tree/master/dist