前端js读取本地excel表

最新推荐文章于 2024-10-11 16:29:01 发布

荒年-yang

最新推荐文章于 2024-10-11 16:29:01 发布

阅读量3.7k

点赞数 1

分类专栏： html

本文链接：https://blog.csdn.net/u012424449/article/details/106102352

版权

html 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
 <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
  <meta charset="utf-8" /> 
  <title>excel demo</title> 
  <script src="https://blog-static.cnblogs.com/files/xieyongbin/xlsx.full.min.js"></script>
  <script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js"></script>
  <style>

  </style> 
  <script type="text/javascript">
      // 读取本地excel文件
    function readWorkbookFromLocalFile(file) {
        var reader = new FileReader();
        reader.onload = function(e) {
            var data = e.target.result;
            var workbook = XLSX.read(data, {type: 'binary'});
            // 处理excel文件
            handle(workbook);
        };
        reader.readAsBinaryString(file);
    }

    // 处理excel文件
    function handle(workbook) {
        // workbook.SheetNames[0] excel第一个sheet
         var datas = XLSX.utils.sheet_to_json(workbook.Sheets[workbook.SheetNames[0]]);
        
         if(datas.length > 0){

            // 获取列名是汇总列名，避免某行某个字段没有值，会缺少字段
            // 标题
            var title = [];
            // 获取每行数据
            first:
            for(var index in datas){ // datas数组，index为索引
                second:
                for(var key in datas[index]){ // datas[index]对象,key为键
                    if (-1 === title.indexOf(key)) {
                        title.push(key);
                    }
                }
            }
            // 列名
            console.log(title);
            // 数据
            console.log(datas);
        }  
    }

  </script>
 </head> 
 <body>
      <form>
       <input type="file" name="file" onchange="readWorkbookFromLocalFile(this.files[0])"/>
   </form>
 </body>
</html>