js使用js-xlsx插件下载excel

本文主要是下载excel,上传可以参考原生js使用js-xlsx插件

html

<a href="" download="下载文件的名字.xlsx" id="downloadFile"></a>
<input type="button" value="下载" onclick="downloadExl(tableToJsonStr())" />

script

function downloadExl(json, type) {
    var tmpDown; //导出的二进制对象
    var tmpdata = json[0];
    json.unshift({});
    var keyMap = []; //获取keys
    //keyMap =Object.keys(json[0]);
    for (var k in tmpdata) {
        keyMap.push(k);
        json[0][k] = k;
    }
    var tmpdata = []; //用来保存转换好的json
    json.map((v, i) => keyMap.map((k, j) => Object.assign({}, {
        v: v[k],
        position: (j > 25 ? getCharCol(j) : String.fromCharCode(65 + j)) + (i + 1)
    }))).reduce((prev, next) => prev.concat(next)).forEach((v, i) => tmpdata[v.position] = {
        v: v.v
    });
    var outputPos = Object.keys(tmpdata); //设置区域,比如表格从A1到D10
    var tmpWB = {
        SheetNames: ['mySheet'], //保存的表标题
        Sheets: {
            'mySheet': Object.assign({},
                tmpdata, //内容
                {
                    '!ref': outputPos[0] + ':' + outputPos[outputPos.length - 1] //设置填充区域
                })
        }
    };
    tmpDown = new Blob([s2ab(XLSX.write(tmpWB, { bookType: (type == undefined ? 'xlsx' : type), bookSST: false, type: 'binary' } //这里的数据是用来定义导出的格式类型
    ))], {
        type: ""
    }); //创建二进制对象写入转换好的字节流
    var href = URL.createObjectURL(tmpDown); //创建对象超链接
    document.getElementById("downloadFile").href = href; //绑定a标签
    document.getElementById("downloadFile").click(); //模拟点击实现下载
    setTimeout(function() { //延时释放
        URL.revokeObjectURL(tmpDown); //用URL.revokeObjectURL()来释放这个object URL
    }, 100);
}

function s2ab(s) { //字符串转字符流
    var buf = new ArrayBuffer(s.length);
    var view = new Uint8Array(buf);
    for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
    return buf;
}
// 将指定的自然数转换为26进制表示。映射关系:[0-25] -> [A-Z]。
function getCharCol(n) {
    let temCol = '',
        s = '',
        m = 0
    while (n > 0) {
        m = n % 26 + 1
        s = String.fromCharCode(m + 64) + s
        n = (n - m) / 26
    }
    return s
}

function tableToJsonStr () {//根据实际情况通过js拼接json字符串
    var jsonStr = '[ ';
    for (var i = 0; i < $(".listOrder").length; i++) {
        for (var j = 0; j < $(".listOrder")[i].children.length; j+=2) {
            jsonStr += '{"roomNo":"'+ $(".listOrder")[i].children[j].innerText +'",';
               jsonStr += '"lockNo":"'+ $(".listOrder")[i].children[j+1].children[0].value +'"},';
		}
	}
       jsonStr = jsonStr.slice(0,-1) + ']';
    try {
           return JSON.parse(jsonStr);
       } catch (e) {
           console.error(e);
       }
}

方法downloadExl(json, type)中的json示例:

[{"姓名":"张三","性别":"男"},{"姓名":"李四","性别":"男"}]

生成表格

姓名性别
张三
李四
  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
js-xlsx是一个用于导出Excel文件的JavaScript库。它能够将JavaScript数据对象转换成Excel文件,并提供了丰富的配置选项,以便于用户灵活地定制导出的Excel文件的格式和内容。 首先,我们需要引入js-xlsx的库文件,可以通过在线CDN引入或者下载到本地并引入到项目中。然后,我们可以在JavaScript代码中使用js-xlsx的API来进行Excel导出的相关操作。 使用js-xlsx导出Excel的基本步骤如下: 1. 创建一个工作簿对象:通过`XLSX.utils.book_new()`函数创建一个新的工作簿对象。 2. 创建一个工作表对象:通过`XLSX.utils.table_to_sheet()`函数将JavaScript数据对象转换成工作表对象。 3. 将工作表对象添加到工作簿中:通过`XLSX.utils.book_append_sheet()`函数将工作表对象添加到工作簿中。 4. 将工作簿对象转换成Excel文件:通过`XLSX.write()`函数将工作簿对象写入Excel文件。 5. 下载或保存Excel文件:使用下载插件或者将生成的Excel文件保存到本地。 例子代码如下: ``` // 引入js-xlsx库文件 <script src="xlsx.core.min.js"></script> // 创建一个工作簿对象 var workbook = XLSX.utils.book_new(); // 创建一个工作表对象 var worksheet = XLSX.utils.table_to_sheet(document.getElementById('tableId')); // 将工作表对象添加到工作簿中 XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1'); // 将工作簿对象转换成Excel文件 var excelFile = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' }); // 下载或保存Excel文件 downloadExcelFile(excelFile, 'exportedFile.xlsx'); // 下载Excel文件 function downloadExcelFile(data, filename) { var blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }); if (window.navigator.msSaveOrOpenBlob) { window.navigator.msSaveBlob(blob, filename); } else { var elem = window.document.createElement('a'); elem.href = window.URL.createObjectURL(blob); elem.download = filename; document.body.appendChild(elem); elem.click(); document.body.removeChild(elem); } } ``` 通过以上步骤,我们可以轻松地使用js-xlsx导出Excel文件,并根据需要进行相应的定制和配置。希望对你有所帮助!
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值