前端录入表格打印

最新推荐文章于 2024-04-29 13:19:48 发布

Jony_9

最新推荐文章于 2024-04-29 13:19:48 发布

阅读量285

点赞数

文章标签： javascript 前端

本文链接：https://blog.csdn.net/Jony_9/article/details/112252610

版权

前端js实现打印excel表格
产品原型：

图片.png
图片.png
功能需求：点击导出考勤表格按钮，会自动下载成Excel格式

图片.png
图片.png
图片.png
图片.png

jsp页面代码：

导出考勤表

js代码

//打印表格
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 = '<html><head><meta charset="UTF-8"></head><body><table  border="1">{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) {
        if (!table.nodeType)
            table = document.getElementById(table)
        var ctx = {
            worksheet : name || 'Worksheet',
            table : table.innerHTML
        }
        window.location.href = uri + base64(format(template, ctx))
    }
})()

完整的可复制黏贴的demo：

<head>
    <meta charset="UTF-8">
    <title></title>
</head>

<body>
    <div class="tools">
        <button type="button" class="btn green" id="excell" onclick="method5('dataTable')">导出考勤表格</button>
    </div>

    <table border="1" id="dataTable">
        <tr>
            <td>王婷111</td>
            <td>一见倾城333 </td>
        </tr>
        <tr>
            <td>祈澈姑娘222</td>
            <td>Python开发者交流平台44</td>
        </tr>
        <tr>
            <td>wwwangting888</td>
            <td>13661725475</td>
        </tr>
    </table>

</body>
<script>
    //打印表格
    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 = '<html><head><meta charset="UTF-8"></head><body><table  border="1">{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) {
            if(!table.nodeType)
                table = document.getElementById(table)
            var ctx = {
                worksheet: name || 'Worksheet',
                table: table.innerHTML
            }
            window.location.href = uri + base64(format(template, ctx))
        }
    })()
</script>

Jony_9

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端录入表格打印

前端js实现打印excel表格产品原型：图片.png图片.png功能需求：点击导出考勤表格按钮，会自动下载成Excel格式图片.png图片.png图片.png图片.pngjsp页面代码：导出考勤表js代码//打印表格var idTmr;function getExplorer() {var explorer = window.navigator.userAgent ;//ieif (explorer.indexOf(“MSIE”) >= 0) {return
复制链接

扫一扫