Javascript 无法使用tableExport将表导出到excel_Javascript_Html

Javascript 无法使用tableExport将表导出到excel

javascript html

Javascript 无法使用tableExport将表导出到excel,javascript,html,Javascript,Html,我有所有提到的脚本，通过搜索，我编写了以下html代码： <table id="customers" class="table table-striped" > <thead> <tr class='warning'> <th>Country</th> <th>Population</th> <th>Date</th&g

我有所有提到的脚本，通过搜索，我编写了以下html代码：

 <table id="customers" class="table table-striped" >
<thead>         
    <tr class='warning'>
        <th>Country</th>
        <th>Population</th>
        <th>Date</th>
        <th>%ge</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>Chinna</td>
        <td>1,363,480,000</td>
        <td>March 24, 2014</td>
        <td>19.1</td>
    </tr>
    <tr>
        <td>India</td>
        <td>1,241,900,000</td>
        <td>March 24, 2014</td>
        <td>17.4</td>
    </tr>
    <tr>
        <td>United States</td>
        <td>317,746,000</td>
        <td>March 24, 2014</td>
        <td>4.44</td>
    </tr>
    <tr>
        <td>Indonesia</td>
        <td>249,866,000</td>
        <td>July 1, 2013</td>
        <td>3.49</td>
    </tr>

</tbody>
</table>              
 <button onClick ="$('#customers').tableExport({type:'excel',escape:'false'});">  XLS</button>


国家
人口
日期
%通用电气
中国
1,363,480,000
2014年3月24日
19.1
印度
1,241,900,000
2014年3月24日
17.4
美国
317,746,000
2014年3月24日
4.44
印度尼西亚
249,866,000
2013年7月1日
3.49
XLS

当我点击按钮时，代码不起任何作用。我的JSFIDLE链接是：代码不工作的原因是什么？

您可以使用jquery ui导出到excel

//table2excel.js
;(function ( $, window, document, undefined ) {
var pluginName = "table2excel",

defaults = {
    exclude: ".noExl",
            name: "Table2Excel"
};

// The actual plugin constructor
function Plugin ( element, options ) {
        this.element = element;
        this.settings = $.extend( {}, defaults, options );
        this._defaults = defaults;
        this._name = pluginName;
        this.init();
}

Plugin.prototype = {
    init: function () {
        var e = this;

        e.template = {
            head: "<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>",
            sheet: {
                head: "<x:ExcelWorksheet><x:Name>",
                tail: "</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>"
            },
            mid: "</x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body>",
            table: {
                head: "<table>",
                tail: "</table>"
            },
            foot: "</body></html>"
        };

        e.tableRows = [];

        // get contents of table except for exclude
        $(e.element).each( function(i,o) {
            var tempRows = "";
            $(o).find("tr").not(e.settings.exclude).each(function (i,o) {
                tempRows += "<tr>" + $(o).html() + "</tr>";
            });
            e.tableRows.push(tempRows);
        });

        e.tableToExcel(e.tableRows, e.settings.name);
    },

    tableToExcel: function (table, name) {
        var e = this, fullTemplate="", i, link, a;

        e.uri = "data:application/vnd.ms-excel;base64,";
        e.base64 = function (s) {
            return window.btoa(unescape(encodeURIComponent(s)));
        };
        e.format = function (s, c) {
            return s.replace(/{(\w+)}/g, function (m, p) {
                return c[p];
            });
        };
        e.ctx = {
            worksheet: name || "Worksheet",
            table: table
        };

        fullTemplate= e.template.head;

        if ( $.isArray(table) ) {
            for (i in table) {
                //fullTemplate += e.template.sheet.head + "{worksheet" + i + "}" + e.template.sheet.tail;
                fullTemplate += e.template.sheet.head + "Table" + i + "" + e.template.sheet.tail;
            }
        }

        fullTemplate += e.template.mid;

        if ( $.isArray(table) ) {
            for (i in table) {
                fullTemplate += e.template.table.head + "{table" + i + "}" + e.template.table.tail;
            }
        }

        fullTemplate += e.template.foot;

        for (i in table) {
            e.ctx["table" + i] = table[i];
        }
        delete e.ctx.table;

        if (typeof msie !== "undefined" && msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer
        {
            if (typeof Blob !== "undefined") {
                //use blobs if we can
                fullTemplate = [fullTemplate];
                //convert to array
                var blob1 = new Blob(fullTemplate, { type: "text/html" });
                window.navigator.msSaveBlob(blob1, getFileName(e.settings) );
            } else {
                //otherwise use the iframe and save
                //requires a blank iframe on page called txtArea1
                txtArea1.document.open("text/html", "replace");
                txtArea1.document.write(e.format(fullTemplate, e.ctx));
                txtArea1.document.close();
                txtArea1.focus();
                sa = txtArea1.document.execCommand("SaveAs", true, getFileName(e.settings) );
            }

        } else {
            link = e.uri + e.base64(e.format(fullTemplate, e.ctx));
            a = document.createElement("a");
            a.download = getFileName(e.settings);
            a.href = link;

            document.body.appendChild(a);

            a.click();

            document.body.removeChild(a);
        }

        return true;
    }
};

function getFileName(settings) {
    return ( settings.filename ? settings.filename : "table2excel") + ".xls";
}

$.fn[ pluginName ] = function ( options ) {
    var e = this;
        e.each(function() {
            if ( !$.data( e, "plugin_" + pluginName ) ) {
                $.data( e, "plugin_" + pluginName, new Plugin( this, options ) );
            }
        });

    // chain jQuery functions
    return e;
};

})( jQuery, window, document );


$("#excel").click(function(){

                    $("#customers").table2excel({
                          exclude: ".noExl",
                    name: "Excel Document customers"
                    }); 

                     });

//table2excel.js
;（函数（$，窗口，文档，未定义）{
var pluginName=“table2excel”，
默认值={
排除：“.noExl”，
名称：“Table2Excel”
};
//实际的插件构造函数
函数插件（元素、选项）{
this.element=元素；
this.settings=$.extend（{}，默认值，选项）；
这是默认值；
这个。_name=pluginName；
this.init（）；
}
Plugin.prototype={
init：函数（）{
var e=此；
e、 模板={
头：“，
表:{
头：“，
尾巴：“
},
脚：“
};
e、 tableRows=[]；
//获取表的内容（排除除外）
$（e.element）。每个（函数（i，o）{
var tempRows=“”；
$（o）.find（“tr”）.not（e.settings.exclude）.each（函数（i，o）{
tempRows+=“”+$（o）.html（）+“”；
});
e、 tableRows.push（tempRows）；
});
e、 tableToExcel（e.tableRows，e.settings.name）；
},
tableToExcel:函数（表，名称）{
var e=此，fullTemplate=“”，i，link，a；
e、 uri=“data:application/vnd.ms excel；base64”；
e、 base64=函数{
返回窗口.btoa（unescape（encodeURIComponent））；
};
e、 格式=函数（s，c）{
返回s.replace（/{（\w+）}/g，函数（m，p）{
返回c[p]；
});
};
e、 ctx={
工作表：名称| |“工作表”，
表：表
};
fullTemplate=e.template.head；
如果（$.isArray（表））{
对于（表中的i）{
//fullTemplate+=e.template.sheet.head+“{sheet”+i+“}”+e.template.sheet.tail；
fullTemplate+=e.template.sheet.head+“Table”+i+“”+e.template.sheet.tail；
}
}
fullTemplate+=e.template.mid；
如果（$.isArray（表））{
对于（表中的i）{
fullTemplate+=e.template.table.head+“{table”+i+“}”+e.template.table.tail；
}
}
fullTemplate+=e.template.foot；
对于（表中的i）{
e、 ctx[“表”+i]=表[i]；
}
删除e.ctx.table；
如果（msie的类型！=“未定义”&&msie>0 | |！！navigator.userAgent.match（/Trident.*rv \：11\。/）//如果Internet Explorer
{
如果（Blob的类型！=“未定义”）{
//如果可以的话，使用blob
fullTemplate=[fullTemplate]；
//转换为数组
var blob1=new Blob（fullTemplate，{type:“text/html”}）；
msSaveBlob（blob1，getFileName（e.settings））；
}否则{
//否则，请使用iframe并保存
//需要名为txtArea1的页面上的空白iframe
txtArea1.document.open（“text/html”、“replace”）；
txtArea1.document.write（e.format（fullTemplate，e.ctx））；
txtArea1.document.close（）；
txtArea1.focus（）；
sa=txtArea1.document.execCommand（“SaveAs”，true，getFileName（e.settings））；
}
}否则{
link=e.uri+e.base64（e.format（fullTemplate，e.ctx））；
a=document.createElement（“a”）；
a、 下载=获取文件名（如设置）；
a、 href=链接；
文件.正文.附件（a）；
a、 单击（）；
文件.body.removeChild（a）；
}
返回true；
}
};
函数getFileName（设置）{
返回（settings.filename？settings.filename:“table2excel”）+“.xls”；
}
$.fn[pluginName]=函数（选项）{
var e=此；
e、 每个（函数（）{
if（！$.data（e，“plugin_”+pluginName））{
$.data（e，“plugin_”+pluginName，新插件（此，选项））；
}
});
//链jQuery函数
返回e；
};
})（jQuery、窗口、文档）；
$（“#excel”）。单击（函数（）{
$（“#客户”）。表2 EXCEL({
排除：“.noExl”，
名称：“Excel文档客户”
}); 
});

检查这个fiddle->

它看起来像是

tableExport

函数使用jQuery。在包含定义

tableExport

的库之前，您是否包含了这些内容？