前端Table⽤JS导出Excel数字⾃动变成科学计数法问题
前端导出的表格，类似于这种样式的解决办法分析出原因，使⽤JS将Table数据导出到Excel中，如果td中书纯数字的话，在Excel格式就是number类型，所以，想长数字会变成科学计数法。
于是乎就在⽹上百度对应的解决办法，在转换导⼊到Excel前给给类型变成字符串String类型。
百度上是这样的，在td中加⼀个样式 style=‘mso-number-format:"@"’，如这样的
<td style='mso-number-format:"\@"'><label class="text">000001</label></td>
1
我在想我能不能在调⽤导出Excel的公共⽅法中做处理，给他加上呢，
发现调⽤导出Excel的公共⽅法中可以做批量修改，（直接贴上改后代码）
var tableToExcel = (function() {
var uri = 'data:application/vnd.ms-excel;base64,',
template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="/TR/REC-ht      base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) ;},
format = function(s, c) { place(/{(\w+)}/g, function(m, p) { return c[p]; }); };
return function(table, name, filename) {
if (!deType) table = ElementById(table);
//console打印出table.innerHTML出则是table的页⾯代码
js正则表达式判断数字//根据正则表达式，把style='mso-number-format:"\@"' 塞⼊td中，将数据转成String
table.innerHTML = place(/<td/g, "<td STYLE='MSO-NUMBER-FORMAT:\\@'");
var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML };//此时的innerHTML数据可以⾃⼰
⾃定义⽐如json转化只要值要数据符合即可
var link = ateElement("A");
link.href = uri + base64(format(template, ctx));
link.download = filename;
document.body.appendChild(link);
link.click();
veChild(link);
};
});
其实就是在点击导出按钮的时候，⽣成的table表格的td使⽤正则动态替换成：
appendHtml = place(/<td/g, "<td STYLE='MSO-NUMBER-FORMAT:\\@'");
此时问题完美解决，不会再根据科学计数法展⽰表格内容！
完整代码⽚段：
exportExcel () {
// 使⽤outerHTML属性获取整个table元素的HTML代码（包括<table>标签），然后包装成⼀个完整的HTML⽂档，设置charset为urf-8以防⽌中⽂乱码        let tableHtml = ElementsByClassName("creditrecord");
var appendHtml = "";
for(var i=0;i<tableHtml.length;i++){
appendHtml+=tableHtml[i].outerHTML
}
appendHtml = place(/<td/g, "<td STYLE='MSO-NUMBER-FORMAT:\\@'");
let html = "<html><head><meta charset='utf-8' /></head><body>" + appendHtml + "</body></html>";
// 实例化⼀个Blob对象，其构造函数的第⼀个参数是包含⽂件内容的数组，第⼆个参数是包含⽂件类型属性的对象
let blob = new Blob([html], { type: "application/vnd.ms-excel" });  //application/octet-stream
//也可以⽤js创建⼀个a标签
let a = ateElement('a');
// var a = ElementsByTagName("a")[0];
// 利⽤ateObjectURL()⽅法为a元素⽣成blob URL
a.href = ateObjectURL(blob);
// 设置⽂件名
a.download = "统计表.xls";  //xlsx
a.click();
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。