table2excel 导出表格有边框，文字居中

应项目需要，前端直接导出表格中的数据。
百度找到了table2excel ，很实用，但是导出的表格没有边框，且表格中的数据没有居中。
网上没找到对应的办法，就自己对table2excel.js做了修改，能够实现导出的表格有边框，文字居中的要求，故写本文记录下。

基于jQuery table2excel - v1.1.1，大家可根据实际需求，将功能再做升级。我现在也只是简单粗暴的添加了下功能。

修改的位置如下：
52行：head: "<table >"修改为head: "<table border='1'>"
65行：tempRows += "<tr >";修改为tempRows += "<tr align='center' valign='center' >";
75行：tempRows += "<td > </td>";修改为tempRows += "<td align='center' valign='center' > </td>";
77行：tempRows += "<td ";修改为tempRows += "<td align='center' valign='center' ";

使用的方法还是官方的方法：

 $(".table2excel").table2excel({exclude: ".noExl",name: "Excel Document Name",filename: "导出的文件名",exclude_img: true,exclude_links: true,exclude_inputs: true});

然后想要知道怎么解决打开表格时的不安全提示框问题。

最后附上修改后的源码，大家导入到项目中直接用就好了：

/**  jQuery table2excel - v1.1.1*  jQuery plugin to export an .xls file in browser from an HTML table*  https://github.com/rainabba/jquery-table2excel**  Made by rainabba*  Under MIT License*  *  添加功能：导出表格边框，文字居中*/
//table2excel.js
;(function ( $, window, document, undefined ) {var pluginName = "table2excel",defaults = {exclude: ".noExl",name: "Table2Excel",filename: "table2excel",fileext: ".xls",exclude_img: true,exclude_links: true,exclude_inputs: true};// The actual plugin constructorfunction Plugin ( element, options ) {this.element = element;// jQuery has an extend method which merges the contents of two or// more objects, storing the result in the first object. The first object// is generally empty as we don't want to alter the default options for// future instances of the plugin//this.settings = $.extend( {}, defaults, options );this._defaults = defaults;this._name = pluginName;this.init();}Plugin.prototype = {init: function () {var e = this;var utf8Heading = "<meta http-equiv=\"content-type\" content=\"application/vnd.ms-excel; charset=UTF-8\">";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\">" + utf8Heading + "<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 border='1'>",//表格边框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,p) {tempRows += "<tr align='center' valign='center' >"; //文字居中$(p).find("td,th").not(e.settings.exclude).each(function (i,q) { // p did not exist, I correctedvar rc = {rows: $(this).attr("rowspan"),cols: $(this).attr("colspan"),flag: $(q).find(e.settings.exclude)};if( rc.flag.length > 0 ) {tempRows += "<td align='center' valign='center' > </td>"; // exclude it!! //文字居中} else {tempRows += "<td align='center' valign='center' "; //文字居中if( rc.rows > 0) {tempRows += " rowspan=\'" + rc.rows + "\' ";}if( rc.cols > 0) {tempRows += " colspan=\'" + rc.cols + "\' ";}tempRows += "/>" + $(q).html() + "</td>";}});tempRows += "</tr>";});// exclude img tagsif(e.settings.exclude_img) {tempRows = exclude_img(tempRows);}// exclude link tagsif(e.settings.exclude_links) {tempRows = exclude_links(tempRows);}// exclude input tagsif(e.settings.exclude_inputs) {tempRows = exclude_inputs(tempRows);}e.tableRows.push(tempRows);});e.tableToExcel(e.tableRows, e.settings.name, e.settings.sheetName);},tableToExcel: function (table, name, sheetName) {var e = this, fullTemplate="", i, link, a;e.format = function (s, c) {return s.replace(/{(\w+)}/g, function (m, p) {return c[p];});};sheetName = typeof sheetName === "undefined" ? "Sheet" : sheetName;e.ctx = {worksheet: name || "Worksheet",table: table,sheetName: sheetName};fullTemplate= e.template.head;if ( $.isArray(table) ) {Object.keys(table).forEach(function(i){//fullTemplate += e.template.sheet.head + "{worksheet" + i + "}" + e.template.sheet.tail;fullTemplate += e.template.sheet.head + sheetName + i + e.template.sheet.tail;});}fullTemplate += e.template.mid;if ( $.isArray(table) ) {Object.keys(table).forEach(function(i){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;var isIE = /*@cc_on!@*/false || !!document.documentMode; // this works with IE10 and IE11 both :)//if (typeof msie !== "undefined" && msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // this works ONLY with IE 11!!!if (isIE) {if (typeof Blob !== "undefined") {//use blobs if we canfullTemplate = e.format(fullTemplate, e.ctx); // with this, works with IEfullTemplate = [fullTemplate];//convert to arrayvar 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 txtArea1txtArea1.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 {var blob = new Blob([e.format(fullTemplate, e.ctx)], {type: "application/vnd.ms-excel"});window.URL = window.URL || window.webkitURL;link = window.URL.createObjectURL(blob);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" );}// Removes all img tagsfunction exclude_img(string) {var _patt = /(\s+alt\s*=\s*"([^"]*)"|\s+alt\s*=\s*'([^']*)')/i;return string.replace(/<img[^>]*>/gi, function myFunction(x){var res = _patt.exec(x);if (res !== null && res.length >=2) {return res[2];} else {return "";}});}// Removes all link tagsfunction exclude_links(string) {return string.replace(/<a[^>]*>|<\/a>/gi, "");}// Removes input paramsfunction exclude_inputs(string) {var _patt = /(\s+value\s*=\s*"([^"]*)"|\s+value\s*=\s*'([^']*)')/i;return string.replace(/<input[^>]*>|<\/input>/gi, function myFunction(x){var res = _patt.exec(x);if (res !== null && res.length >=2) {return res[2];} else {return "";}});}$.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 functionsreturn e;};})( jQuery, window, document );

table2excel 导出表格有边框，文字居中相关推荐

如何将Word表格内的文字居中对齐
Word中的文字居中对齐,相信很多人都会,但是要你把Word表格里面的文字也进行居中对齐,就不见得人人都会了.Word联盟收集了一些方法,下面,就把各种方法跟大家介绍一下. 方法一直接选中表格内的文 ...
【wps】插入表格里的文字居中
问题: 表格里的文字太靠上,想居中对齐解决方案原因:只让段落居中,但表格没有居中. 1.选中表格,右键,选择"表格属性" 2.表格和单元格都要选择"居中"方 ...
phpword表格使用以及文字居中、单元格合并问题
注:在thinkphp6.0项目目录使用composer下载phpoffice,以下是官方给的table的案例 <?php namespace app\controller; use PhpOf ...
word：表格中的文字居中
如操作: 如下图,选择布局,点击2就可以把表格居中了. 居中结果:
【word导出】JAVA使用POI实现word导出表格并简单设置样式
参考资料 Java POI导出word文件及生成表格 POI官方文档网站如何让表格中的文字居中 XWPFTableRow rowBt = table.createRow(); XWPFTableCe ...
table2excel 页面导出excel 带边框，文字剧中
导入下面 js 文件 /** jQuery table2excel - v1.1.2* jQuery plugin to export an .xls file in browser from an ...
用Xlsx xlsx-style 导出excel表格，附带合并单元格，文字居中，文字颜色字体大小等样式 (复制即可实现)
提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录系列文章目录前言一.用Xlsx xlsx-style 导出excel表格二.使用步骤 1.安装插件 2.引入总结前 ...
单元格里的字怎样居中_excel表格内的文字怎么才能居中
我们在excel中输入文字的时候,默认对齐方式都是左对齐的,但是我们想要设置为居中该如何操作呢?其实设置居中方法不难,下面学习啦给大家分享excel表格内文字居中输入的设置方法,欢迎大家来到学习啦学习 ...
latex 表格单元格上下左右居中_Excel文字对齐技巧：学会这6种方式，快速整理规范表格...
[温馨提示]亲爱的朋友,阅读之前请您点击[关注],您的支持将是我最大的动力! Excel制作表格中,文字在单元格内对齐的方式,我们经常用到的有居中对齐.居右对齐.居左对齐,对过这些对齐方式,可以编辑出 ...
bitmap画文字居中_【每日问答29】一键居中CAD表格中的文字
文尾左下角阅读原文看视频教程好课推荐: 1.CAD2014:点击查看 2.室内CAD:点击查看 3.CAD2019:点击查看4.CAD2018:点击查看5.Bim教程:点击查看6.室内手绘:点击查看 ...

table2excel 导出表格有边框，文字居中

table2excel 导出表格有边框，文字居中相关推荐

最新文章

热门文章