Question

我尝试将datatable html导出到excel文件但是现在，我不知道如何在savefiledialog弹出窗口中设置文件名

这里是我的代码

 $('#exportTable').click(function () {

  var startDate =  $('#startDate').val();
  var endDate =  $('#endDate').val();
  searchReportWithDate(startDate, endDate);

  setTimeout(function () {
  var rowCount = $('#tblExportData >tbody >tr').length;
  alert(rowCount);
  if (rowCount > 0)
    {
        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]--><meta http-equiv="content-type" content="text/plain; charset=UTF-8"/></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 (table, name) {
        table = document.getElementById("tblExportData")
        var ctx = {worksheet: name || 'Sheet1', table: table.innerHTML}
        window.location.href = uri + base64(format(template, ctx))
        }()
    }
  }, 5000);
 });

Answer 1

删除setTimeout，在链接上设置download attribite（点击之前）并传递Blob流。

这是一个想法的例子。务必检查浏览器支持的每个部分 https://jsfiddle.net/ppneeqjy/

＆＃13;

document.querySelector("a").addEventListener('click', function (e) {
  var data = new Uint8Array([0x89,0x50,0x4E,0x47,0x0D,0x0A,0x1A,0x0A,0x00,0x00,0x00,0x0D,0x49,0x48,0x44,0x52,0x00,0x00,0x00,0x08,0x00,0x00,0x00,0x08,0x01,0x03,0x00,0x00,0x00,0xFE,0xC1,0x2C,0xC8,0x00,0x00,0x00,0x06,0x50,0x4C,0x54,0x45,0xFF,0xFF,0xFF,0x00,0x00,0x00,0x55,0xC2,0xD3,0x7E,0x00,0x00,0x00,0x16,0x49,0x44,0x41,0x54,0x78,0x5E,0x63,0xF8,0xCF,0xD0,0xC8,0xB0,0x97,0x61,0x29,0x10,0xEE,0x05,0xB2,0xFE,0x03,0x00,0x2E,0x30,0x05,0xC5,0x31,0x03,0x9F,0xF7,0x00,0x00,0x00,0x00,0x49,0x45,0x4E,0x44,0xAE,0x42,0x60,0x82]);
  var blob = new Blob([data], {type: 'image/png'});
  e.target.href = URL.createObjectURL(blob);
});

＆＃13;

<a href="#" download="smth.png">Click to download</a>

＆＃13;

Answer 2

由于附件文件名已在响应标题中设置，我认为您无法更改，因为您无法在javascript中更改响应标头

Answer 3

 function tableToExcel  (table, fileName,worksheetName) {
            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"><meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8"><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];
                    })
                }
            if (!table.nodeType) table = document.getElementById(table)
            var ctx = {worksheet: worksheetName || 'Worksheet', table: table.innerHTML}
            var a = document.createElement('a');
            a.href = uri + base64(format(template, ctx))
            a.download = fileName + '.xls';
            //triggering the function
            a.click();
        }

如何设置要从html表导出的excel文件的文件名

3 个答案: