使用tableExport.js直接導出web頁面上的table

1，需要導入兩個js文件，一個tableExport.js，另一個是jquery.base64.js，前一個文件是導出數據和核心類庫，后一個是為了避免導出中文時亂碼的js文件，如果你導出的數據沒有中文，可以不適用它。

說明：只能對table標簽進行操作

2，導入以上兩個js后，為下載按鈕綁定事件，如下代碼是最簡單的導出配置

//文件導出--------------------------
$("#btnExport").click(function(){
        $('#stats_datatable').tableExport({
        type:'excel',
        escape:'false',
        fileName: 'UV_statistic_table'
        });
    });

說明：stats_datatable是table標簽的id

<table class="table table-striped" id="stats_datatable" >
<tbody id='uvnum'>
</tbody>
</table>

3，可以查看tableExport.js文件相關詳細配置，一下是源碼中默認配置

  $.fn.extend({
        tableExport: function (options) {
            var defaults = {
                consoleLog: false,
                csvEnclosure: '"',
                csvSeparator: ',',
                csvUseBOM: true,
                displayTableName: false,
                escape: false,
                excelstyles: ['border-bottom', 'border-top', 'border-left', 'border-right'],
                fileName: 'tableExport',
                htmlContent: false,
                ignoreColumn: [],
                ignoreRow: [],
                jspdf: {
                    orientation: 'p',
                    unit: 'pt',
                    format: 'a4',
                    margins: { left: 20, right: 10, top: 10, bottom: 10 },
                    autotable: {
                        padding: 2,
                        lineHeight: 12,
                        fontSize: 8,
                        tableExport: {
                            onAfterAutotable: null,
                            onBeforeAutotable: null,
                            onTable: null
                        }
                    }
                },
                numbers: {
                    html: {
                        decimalMark: '.',
                        thousandsSeparator: ','
                    },
                    output: {
                        decimalMark: '.',
                        thousandsSeparator: ','
                    }
                },
                onCellData: null,
                outputMode: 'file', // file|string|base64
                tbodySelector: 'tr',
                theadSelector: 'tr',
                tableName: 'myTableName',
                type: 'csv',
                worksheetName: 'xlsWorksheetName'
            };
---------------------
作者：Itxingfeichen
來源：CSDN
原文：https://blog.csdn.net/xingfeichen/article/details/53840673
版權聲明：本文為博主原創文章，轉載請附上博文鏈接！