【问题标题】:Export html table to ppt on client side?在客户端将html表导出到ppt?
【发布时间】:2015-09-14 09:53:23
【问题描述】:

我想知道我们是否有任何 jquery 或 javascript 解决方案可以将 html 表格转换为 powerpoint。我得到的唯一解决方案是 html table export。在这里,我们有所有的导出选项,但我只想要 powerpoint 的解决方案。我可以使用 Html 表导出,但我担心的是,对于一个导出,我应该使用整个插件。是否有仅用于 ppt 的示例代码?

【问题讨论】:

  • 我建议更好地使用服务器端。
  • @OscarJara 当您可以将一些处理委托给客户端时,为什么服务器会过载?服务器生成一个 HTML 表格,这是一个相当轻的负载,但如果它必须提供下载文档,则从服务器加载数据会不必要地增加。由于不是安全漏洞,所以在客户端导出格式是相当合理的。

标签: javascript jquery plugins jquery-plugins export


【解决方案1】:

如果您担心库的大小,最好的办法可能是自己修改 js 库。取出可能与 power point 功能无关的代码。然后进行测试,逐步使库越来越小。除此之外,我没有发现任何明显已经有此解决方案可用的地方。

通过执行上述练习,我能够将 tableExport.js 文件从 12kb 缩小到 5kb(未最小化),同时仍保持导出到 power-point 的功能。

/*The MIT License (MIT)

Copyright (c) 2014 https://github.com/kayalshri/

Permission is hereby granted....
....
*/

(function($){
    $.fn.extend({
        tableExport: function(options) {
            var defaults = {
                    separator: ',',
                    ignoreColumn: [],
                    tableName:'yourTableName',
                    type:'powerpoint',
                    escape:'true',
                    htmlContent:'false',
                    consoleLog:'false'
            };

            var options = $.extend(defaults, options);
            var el = this;

            if(defaults.type == 'powerpoint'){
                //console.log($(this).html());
                var excel="<table>";
                // Header
                $(el).find('thead').find('tr').each(function() {
                    excel += "<tr>";
                    $(this).filter(':visible').find('th').each(function(index,data) {
                        if ($(this).css('display') != 'none'){                  
                            if(defaults.ignoreColumn.indexOf(index) == -1){
                                excel += "<td>" + parseString($(this))+ "</td>";
                            }
                        }
                    }); 
                    excel += '</tr>';                       

                });                 


                // Row Vs Column
                var rowCount=1;
                $(el).find('tbody').find('tr').each(function() {
                    excel += "<tr>";
                    var colCount=0;
                    $(this).filter(':visible').find('td').each(function(index,data) {
                        if ($(this).css('display') != 'none'){  
                            if(defaults.ignoreColumn.indexOf(index) == -1){
                                excel += "<td>"+parseString($(this))+"</td>";
                            }
                        }
                        colCount++;
                    });                                                         
                    rowCount++;
                    excel += '</tr>';
                });                 
                excel += '</table>'

                if(defaults.consoleLog == 'true'){
                    console.log(excel);
                }

                var excelFile = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:"+defaults.type+"' xmlns='http://www.w3.org/TR/REC-html40'>";
                excelFile += "<head>";
                excelFile += "<!--[if gte mso 9]>";
                excelFile += "<xml>";
                excelFile += "<x:ExcelWorkbook>";
                excelFile += "<x:ExcelWorksheets>";
                excelFile += "<x:ExcelWorksheet>";
                excelFile += "<x:Name>";
                excelFile += "{worksheet}";
                excelFile += "</x:Name>";
                excelFile += "<x:WorksheetOptions>";
                excelFile += "<x:DisplayGridlines/>";
                excelFile += "</x:WorksheetOptions>";
                excelFile += "</x:ExcelWorksheet>";
                excelFile += "</x:ExcelWorksheets>";
                excelFile += "</x:ExcelWorkbook>";
                excelFile += "</xml>";
                excelFile += "<![endif]-->";
                excelFile += "</head>";
                excelFile += "<body>";
                excelFile += excel;
                excelFile += "</body>";
                excelFile += "</html>";

                var base64data = "base64," + $.base64.encode(excelFile);
                window.open('data:application/vnd.ms-'+defaults.type+';filename=exportData.doc;' + base64data);

            }

            function parseString(data){

                if(defaults.htmlContent == 'true'){
                    content_data = data.html().trim();
                }else{
                    content_data = data.text().trim();
                }

                if(defaults.escape == 'true'){
                    content_data = escape(content_data);
                }

                return content_data;
            }

        }
    });
})(jQuery);

您可以使用此代码替换您的 tableExport.js 文件,并通过传入 powerpoint 作为类型以相同的方式调用它,或者您可以省略它,它仍然可以工作。

【讨论】:

  • 我使用的是相同的插件,但对于 PowerPoint,它显示空白数据,我也已在 github 中检查该问题:github.com/wenzhixin/bootstrap-table/issues/1660 它适用于 PowerPoint,您能指导我进行哪些更改PowerPoint。
  • @AlokJha 抱歉,我从未真正使用过这个插件。但是在您引用的链接中,似乎 bootstrap-table 在某一时刻有 PDF 选项,但它从未受到支持/工作,因此它被删除了。见:github.com/wenzhixin/bootstrap-table/commit/…
【解决方案2】:

您可以使用相同的解决方案,将 JS 文件修改为仅使用与 MS-Office 相关的部分。其实转换Porwerpoint表格的功能和转换Excel和Word的功能是一样的。

为此,您只需要 jquery.base64.js 文件和 tableExport.js 文件,但 更改所有 tableExport.js以下内容

/*The MIT License (MIT)
Copyright (c) 2014 https://github.com/kayalshri/
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.*/

(function($){
        $.fn.extend({
            tableExport: function(options) {
                var defaults = {
                        separator: ',',
                        ignoreColumn: [],
                        tableName:'yourTableName',
                        type:'excel',
                        escape:'true',
                        htmlContent:'false',
                        consoleLog:'false'
                };

                var options = $.extend(defaults, options);
                var el = this;

                if(defaults.type == 'excel' || defaults.type == 'doc'|| defaults.type == 'powerpoint'  ){
                    //console.log($(this).html());
                    var excel="<table>";
                    // Header
                    $(el).find('thead').find('tr').each(function() {
                        excel += "<tr>";
                        $(this).filter(':visible').find('th').each(function(index,data) {
                            if ($(this).css('display') != 'none'){                  
                                if(defaults.ignoreColumn.indexOf(index) == -1){
                                    excel += "<td>" + parseString($(this))+ "</td>";
                                }
                            }
                        }); 
                        excel += '</tr>';                       

                    });                 


                    // Row Vs Column
                    var rowCount=1;
                    $(el).find('tbody').find('tr').each(function() {
                        excel += "<tr>";
                        var colCount=0;
                        $(this).filter(':visible').find('td').each(function(index,data) {
                            if ($(this).css('display') != 'none'){  
                                if(defaults.ignoreColumn.indexOf(index) == -1){
                                    excel += "<td>"+parseString($(this))+"</td>";
                                }
                            }
                            colCount++;
                        });                                                         
                        rowCount++;
                        excel += '</tr>';
                    });                 
                    excel += '</table>'

                    if(defaults.consoleLog == 'true'){
                        console.log(excel);
                    }

                    var excelFile = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:"+defaults.type+"' xmlns='http://www.w3.org/TR/REC-html40'>";
                    excelFile += "<head>";
                    excelFile += "<!--[if gte mso 9]>";
                    excelFile += "<xml>";
                    excelFile += "<x:ExcelWorkbook>";
                    excelFile += "<x:ExcelWorksheets>";
                    excelFile += "<x:ExcelWorksheet>";
                    excelFile += "<x:Name>";
                    excelFile += "{worksheet}";
                    excelFile += "</x:Name>";
                    excelFile += "<x:WorksheetOptions>";
                    excelFile += "<x:DisplayGridlines/>";
                    excelFile += "</x:WorksheetOptions>";
                    excelFile += "</x:ExcelWorksheet>";
                    excelFile += "</x:ExcelWorksheets>";
                    excelFile += "</x:ExcelWorkbook>";
                    excelFile += "</xml>";
                    excelFile += "<![endif]-->";
                    excelFile += "</head>";
                    excelFile += "<body>";
                    excelFile += excel;
                    excelFile += "</body>";
                    excelFile += "</html>";

                    var base64data = "base64," + $.base64.encode(excelFile);
                    window.open('data:application/vnd.ms-'+defaults.type+';filename=exportData.doc;' + base64data);

                }


                function parseString(data){

                    if(defaults.htmlContent == 'true'){
                        content_data = data.html().trim();
                    }else{
                        content_data = data.text().trim();
                    }

                    if(defaults.escape == 'true'){
                        content_data = escape(content_data);
                    }



                    return content_data;
                }

            }
        });
    })(jQuery);

所有其他文件,包括jspdf文件夹都可以删除。

这样你可以将表格导出为ex​​cel、doc和PowerPoint格式(实际上,当导出为doc和powerpoint时,你所做的就是在文档中嵌入一个Excel电子表格,所以这三种格式的插件都是一样的)

插件的使用方式与原插件相同

【讨论】:

  • 好的,我会试试这个,然后再回复你。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-07-20
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-07-04
  • 1970-01-01
  • 2021-09-20
相关资源
最近更新 更多