使用jQuery导出Excel时如何设置自定义文件名？

阿华AIGC实验室

2026-5-19

自定义Excel导出文件名的实现方法

嘿，我来帮你搞定这个自定义导出文件名的问题～你现在用的这个基于data URI的导出方案，默认浏览器会用类似download的通用文件名，要改成自己想要的名字其实很简单，只需要给你的tableToExcel函数加个文件名参数，再利用HTML5的download属性就行。

修改后的完整代码示例

我把你的代码补全并做了修改，直接用就行：

<input type="button" onclick="tableToExcel('export', 'sheetname', '我的销售报表.xls')" value="Export to Excel">
<script type="text/javascript">
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="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',
      base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) },
      format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) };
  return function(tableId, worksheetName, fileName) {
    var table = document.getElementById(tableId),
        ctx = {worksheet: worksheetName || 'Worksheet', table: table.innerHTML},
        data = uri + base64(format(template, ctx));
    
    // 创建临时下载链接
    var link = document.createElement('a');
    link.href = data;
    // 设置自定义文件名，默认值是"导出表格.xls"
    link.download = fileName || '导出表格.xls';
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
  };
})();
</script>

关键改动说明

给tableToExcel函数新增了第三个参数fileName，专门用来接收你想要的自定义文件名
在生成下载链接时，给临时创建的<a>标签添加download属性，这个HTML5特性可以直接指定下载文件的名称
调用函数时，在第三个参数位置传入你的自定义文件名（记得加上.xls后缀，确保浏览器识别为Excel文件），示例：tableToExcel('export', 'sheetname', '我的销售报表.xls')