zoukankan      html  css  js  c++  java
  • 纯前端导出excel

      1 //导出
      2 function exportExcel() {
      3     var row = $("#dgItemList").bootstrapTable("getSelections");
      4 
      5     if (row == null || row == undefined || row.length == 0) {
      6         toastr.warning("请先选择要导出的数据!");
      7         return;
      8     }
      9 
     10     var name = row[0].RecordCode;  //委托单位
     11 
     12     var csv = table2csv('#dgItemList');
     13     var sheet = csv2sheet(csv);
     14     var blob = sheet2blob(sheet);
     15     openDownloadDialog(blob, name + '.xlsx');
     16 }
     17 
     18 //获取表格数据
     19 function table2csv(table) {
     20     var csv = [];
     21 
     22     var temp = [];
     23     //获取表头
     24     $(table).find('thead tr').each(function () {
     25         $(this).find('th').each(function () {
     26             temp.push($(this).text());
     27         })
     28 
     29         temp.shift(); // 移除第一个
     30         csv.push(temp.join('、'));
     31     });
     32 
     33     //获取表格内容
     34     $(table).find('tr').each(function (index, item) {
     35         var temp1 = [];
     36 
     37         $(this).find('td').each(function () {
     38             if ($(this).html().indexOf('input') > 0)
     39                 temp1.push($(this).children('input').val())
     40             else
     41                 temp1.push($(this).text());
     42 
     43         })
     44         temp1.shift(); // 移除第一个
     45         csv.push(temp1.join('、'));
     46     });
     47     csv.splice(1, 1);//删除第二个空字符串
     48     //csv.shift();
     49     return csv.join('
    ');
     50 }
     51 
     52 // csv转sheet对象
     53 function csv2sheet(csv) {
     54     var sheet = {}; // 将要生成的sheet
     55     csv = csv.split('
    ');
     56     csv.forEach(function (row, i) {
     57         row = row.split('、');
     58         row.splice(row.length - 1, 1);   //删除最后一列操作列
     59         row.splice(0, 1);   //删除第一列状态列
     60         if (i == 0) sheet['!ref'] = 'A1:' + String.fromCharCode(65 + row.length) + (csv.length);
     61         row.forEach(function (col, j) {
     62             sheet[String.fromCharCode(65 + j) + (i + 1)] = { v: col };
     63         });
     64     });
     65 
     66     //设置列宽
     67     sheet['!cols'] = [{ wch: 20 }, { wch: 20 }, { wch: 30 }, { wch: 20 }, { wch: 15 }, { wch: 20 }, { wch: 10 }, { wch: 15 }, { wch: 10 }, { wch: 30 }, { wch: 15 }, { wch: 10 }, { wch: 10 }, { wch: 10 }, { wch: 20 }];
     68 
     69     return sheet;
     70 }
     71 
     72 // 将一个sheet转成最终的excel文件的blob对象,然后利用URL.createObjectURL下载
     73 function sheet2blob(sheet, sheetName) {
     74     sheetName = sheetName || 'sheet1';
     75     var workbook = {
     76         SheetNames: [sheetName],
     77         Sheets: {}
     78     };
     79     workbook.Sheets[sheetName] = sheet;
     80     // 生成excel的配置项
     81     var wopts = {
     82         bookType: 'xlsx', // 要生成的文件类型
     83         bookSST: false, // 是否生成Shared String Table,官方解释是,如果开启生成速度会下降,但在低版本IOS设备上有更好的兼容性
     84         type: 'binary'
     85     };
     86     var wbout = XLSX.write(workbook, wopts);
     87     var blob = new Blob([s2ab(wbout)], { type: "application/octet-stream" });
     88     // 字符串转ArrayBuffer
     89     function s2ab(s) {
     90         var buf = new ArrayBuffer(s.length);
     91         var view = new Uint8Array(buf);
     92         for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
     93         return buf;
     94     }
     95     return blob;
     96 }
     97 
     98 function openDownloadDialog(url, saveName) {
     99     if (typeof url == 'object' && url instanceof Blob) {
    100         url = URL.createObjectURL(url); // 创建blob地址
    101     }
    102     var aLink = document.createElement('a');
    103     aLink.href = url;
    104     aLink.download = saveName || ''; // HTML5新增的属性,指定保存文件名,可以不要后缀,注意,file:///模式下不会生效
    105     var event;
    106     if (window.MouseEvent) event = new MouseEvent('click');
    107     else {
    108         event = document.createEvent('MouseEvents');
    109         event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    110     }
    111     aLink.dispatchEvent(event);
    112 }

     引用js

    1 <script src="~/Scripts/xlsx.core.min.js"></script>

     地址:https://blog-static.cnblogs.com/files/Leeblog200814/xlsx.core.min.js

  • 相关阅读:
    poj2421 Constructing Roads *
    poj1789 Truck History *
    关于最小生成树的一些理解
    资源收集【更新】
    poj2313 Sequence ***
    poj1258 AgriNet **
    最大流的算法小结 Algorithm for Maximum Flow
    算法导论18.32 BTREEDELETE的伪代码
    poj2325 Persistent Numbers ****
    23天的单车旅行,从广州到四川,篇首语
  • 原文地址:https://www.cnblogs.com/Leeblog200814/p/14585319.html
Copyright © 2011-2022 走看看