导入Excel:
html:
<input type="file" onchange="importExcel(this,false,function(data){getJsonData(data)})" class="upload-input" />
<div>
<table class="table table-bordered">
<thead>
<tr>
<th>ID</th>
<th>被派送人手机号</th>
<th>被派送人姓名</th>
<th>派送时间</th>
<th>面额</th>
<th>使用限制</th>
<th>有效期</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<script>
function importExcel(obj,rABS,callback) {
var wb;
if(!obj.files) { return; }
const IMPORTFILE_MAXSIZE = 2*1024;//这里可以自定义控制导入文件大小
var suffix = obj.files[0].name.split(".")[1];
if(suffix != 'xls' && suffix !='xlsx'){
alert('导入的文件格式不正确!');
return;
}
if(obj.files[0].size/1024 > IMPORTFILE_MAXSIZE){
alert('导入的表格文件不能大于2M');
return;
}
var f = obj.files[0];
var reader = new FileReader();
reader.onload = function(e) {
var data = e.target.result;
if(rABS) {
wb = XLSX.read(btoa(fixdata(data)), {//手动转化
type: 'base64'
});
} else {
wb = XLSX.read(data, {
type: 'binary'
});
}
var jsonData=JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) );
callback(jsonData);
};// reader.onload闭合
if(rABS) {
reader.readAsArrayBuffer(f);
} else {
reader.readAsBinaryString(f);
}
}
function getJsonData(jsonData) {
var data = JSON.parse(jsonData);
var str ="";
for(var i=0;i<data.length;i++){
var tr ="<tr>";
for(var j in data[i]){
var td ="<td>";
td += data[i][j];
td += "</td>";
tr +=td;
}
tr += "</tr>";
str +=tr;
}
$("tbody").html(str);
console.log(jsonData); //这里通过回调函数获取到data;
}
</script>
需引入的文件:
ysExport.js
xlsx.full.min.js
导出Excel:
html:
<input type="button" id="btn" value="导出" />
<div>
<table class="table table-bordered" id="example">
<thead>
<tr>
<th>ID</th>
<th>被派送人手机号</th>
<th>被派送人姓名</th>
<th>派送时间</th>
<th>面额</th>
<th>使用限制</th>
<th>有效期</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>张三</td>
<td>男</td>
<td>23</td>
<td>张三</td>
<td>男</td>
<td>23</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>男</td>
<td>27</td>
<td>张三</td>
<td>男</td>
<td>23</td>
</tr>
<tr>
<td>3</td>
<td>王麻子</td>
<td>男</td>
<td>65</td>
<td>张三</td>
<td>男</td>
<td>23</td>
</tr>
</tbody>
</table>
</div>
<script>
$(function(){
$("#btn").click(function(){
$("#example").table2excel({
// 不被导出的表格行的CSS class类
exclude: ".noExl",
// 导出的Excel文档的名称,(没看到作用)
name: "Excel Document Name",
// Excel文件的名称
filename: "意见反馈"
});
});
});
</script>
需引入文件
jq
jquery.table2excel.js
提取码:qwcg