纯前端导出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('\n');
 50 }
 51 
 52 // csv转sheet对象
 53 function csv2sheet(csv) {
 54     var sheet = {}; // 将要生成的sheet
 55     csv = csv.split('\n');
 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

posted @ 2021-03-27 11:38  敲键盘的喵~  阅读(180)  评论(0编辑  收藏  举报