Method example of front-end js printing (exporting) excel table

This article mainly shares with you examples of methods for printing (exporting) excel tables with front-end js. I hope it can help you.

Product prototype:

Picture.png

Functional requirements: Click the Export Attendance Form button and it will be automatically downloaded into Excel format

Picture.png

Picture.png

jsp page code:

<p><button>导出考勤表</button></p>

js code

//打印表格var idTmr;  
function  getExplorer() {  
    var explorer = window.navigator.userAgent ;  
    //ie  
    if (explorer.indexOf("MSIE") >= 0) {            return 'ie';
        }        //firefox  
        else if (explorer.indexOf("Firefox") >= 0) {            return 'Firefox';
        }        //Chrome  
        else if (explorer.indexOf("Chrome") >= 0) {            return 'Chrome';
        }        //Opera  
        else if (explorer.indexOf("Opera") >= 0) {            return 'Opera';
        }        //Safari  
        else if (explorer.indexOf("Safari") >= 0) {            return 'Safari';
        }
    }    function method5(tableid) {        if (getExplorer() == 'ie') {            var curTbl = document.getElementById(tableid);            var oXL = new ActiveXObject("Excel.Application");            var oWB = oXL.Workbooks.Add();            var xlsheet = oWB.Worksheets(1);            var sel = document.body.createTextRange();
            sel.moveToElementText(curTbl);
            sel.select();
            sel.execCommand("Copy");
            xlsheet.Paste();
            oXL.Visible = true;            try {                var fname = oXL.Application.GetSaveAsFilename("Excel.xls",                        "Excel Spreadsheets (*.xls), *.xls");
            } catch (e) {
                print("Nested catch caught " + e);
            } finally {
                oWB.SaveAs(fname);
                oWB.Close(savechanges = false);
                oXL.Quit();
                oXL = null;
                idTmr = window.setInterval("Cleanup();", 1);
            }

        } else {
            tableToExcel(tableid)
        }
    }    function Cleanup() {        window.clearInterval(idTmr);
        CollectGarbage();
    }    var tableToExcel = (function() {        var uri = 'data:application/vnd.ms-excel;base64,', template = '<meta>

{table}', 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) {            if (!table.nodeType)                 table = document.getElementById(table)            var ctx = {                worksheet : name || 'Worksheet',                table : table.innerHTML             }            window.location.href = uri + base64(format(template, ctx))         }     })()

Complete demo that can be copied and pasted:

nbsp;html>

    
        <meta>
        <title></title>
    

    
        <p>
            <button>导出考勤表格</button>
        </p>

        

                                                                                                                                                                                            

王婷111	一见倾城333
祈澈姑娘222	Python开发者交流平台44
wwwangting888	13661725475

         <script> //打印表格 var idTmr; function getExplorer() { var explorer = window.navigator.userAgent; //ie if(explorer.indexOf("MSIE") >= 0) { return &#39;ie&#39;; } //firefox else if(explorer.indexOf("Firefox") >= 0) { return &#39;Firefox&#39;; } //Chrome else if(explorer.indexOf("Chrome") >= 0) { return &#39;Chrome&#39;; } //Opera else if(explorer.indexOf("Opera") >= 0) { return &#39;Opera&#39;; } //Safari else if(explorer.indexOf("Safari") >= 0) { return &#39;Safari&#39;; } } function method5(tableid) { if(getExplorer() == &#39;ie&#39;) { var curTbl = document.getElementById(tableid); var oXL = new ActiveXObject("Excel.Application"); var oWB = oXL.Workbooks.Add(); var xlsheet = oWB.Worksheets(1); var sel = document.body.createTextRange(); sel.moveToElementText(curTbl); sel.select(); sel.execCommand("Copy"); xlsheet.Paste(); oXL.Visible = true; try { var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls"); } catch(e) { print("Nested catch caught " + e); } finally { oWB.SaveAs(fname); oWB.Close(savechanges = false); oXL.Quit(); oXL = null; idTmr = window.setInterval("Cleanup();", 1); } } else { tableToExcel(tableid) } } function Cleanup() { window.clearInterval(idTmr); CollectGarbage(); } var tableToExcel = (function() { var uri = &#39;data:application/vnd.ms-excel;base64,&#39;, template = &#39;<html><head><meta charset="UTF-8"><body><table border="1">{table}</script>

The above is the detailed content of Method example of front-end js printing (exporting) excel table. For more information, please follow other related articles on the PHP Chinese website!