web上传Excel

最新推荐文章于 2025-03-26 14:37:26 发布

眼泪落在琴弦

最新推荐文章于 2025-03-26 14:37:26 发布

阅读量293

点赞数

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/qq_42923536/article/details/120651884

版权

JavaScript XLSX 文件读取 Excel解析前端开发

关键词由优快云通过智能技术生成

前端专栏收录该内容

16 篇文章

订阅专栏

<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport"
    content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>上传文件</title>
  <script type="text/javascript" src='./xlsx.full.min.js'></script>
</head>

<body>
  文件：<br>
  <input type="file" id="file"><br>
</body>
<script>
  //首先监听input框的变动，选中一个新的文件会触发change事件
  document.querySelector("#file").addEventListener("change", function () {
    //获取到选中的文件
    var file = document.querySelector("#file").files[0];
    var type = file.name.split('.');
    if (type[type.length - 1] !== 'xlsx' && type[type.length - 1] !== 'xls') {
      alert('只能选择excel文件导入');
      return false;
    }
    const reader = new FileReader();
    reader.readAsBinaryString(file);
    reader.onload = (e) => {
      const data = e.target.result;
      const zzexcel = window.XLS.read(data, {
        type: 'binary'
      });
      const result = [];
      for (let i = 0; i < zzexcel.SheetNames.length; i++) {
        const newData = window.XLS.utils.sheet_to_json(zzexcel.Sheets[zzexcel.SheetNames[i]]);
        result.push(...newData)
      }
      console.log('result', result)
    }
  });
</script>

</html>