tableExport.js 中关于特殊字符的导出

出现的现象

当table表格中有类似尖括号的特殊字符时,导出就会出现问题,

例如:如下图所示


导出后的格式如下 (xml) 格式 就会出现xml标签不对的问题

如果 表格数据中包含 <fdd>等类型的数据后 ,导出的excel中直接丢失


丢失的原因

var text = htmlData.replace(/\n/g, '\u2028').replace(//gi, '\u2060');

var obj = $('div').html(text).contents(); var number = false; text = ''; $.each(obj.text().split("\u2028"), function (i, v) { if ( i > 0 ) text += " "; text += $.trim(v); });

查看源码得知 

htmlData为 $("td").html()获取的。但是 表格td中嵌套 特殊字符时 对于不识别的标签进行了显示。(html的解析方式,对于不识别标签当成文本处理)

但是在 jquery的这个方法中  $('div').html(text).contents()中 获取了一个 obj,

再用obj获取 text()时 此时 会把 特殊字符的标签忽略。原因在于 $.html()方法会把<ddd>这种标签还原为一个标签。


解决办法

       在导出的回调方法中添加过滤如下

附录 

consoleLog: false

csvEnclosure: '"'

csvSeparator: ','

csvUseBOM: true

displayTableName: false

escape: false

excelFileFormat: 'xlshtml'

excelPageOrientation: 'portrait'

excelRTL: false

excelstyles: []

exportHiddenCells: false

fileName: 'tableExport'

htmlContent: false

ignoreColumn: []

ignoreRow: []

jsonScope: 'all'

jspdf: orientation: 'p'

      unit:'pt'

      format: 'a4'

      margins: left: 20

                right: 10

                top: 10

                bottom: 10

      onDocCreated: null

      autotable: styles: cellPadding: 2

                          rowHeight: 12

                          fontSize: 8

                          fillColor: 255

                          textColor: 50

                          fontStyle: 'normal'

                          overflow: 'ellipsize'

                          halign: 'left'

                          valign: 'middle'

                  headerStyles: fillColor: [52, 73, 94]

                                textColor: 255

                                fontStyle: 'bold'

                                halign: 'center'

                  alternateRowStyles: fillColor: 245

                  tableExport: doc: null

                              onAfterAutotable: null

                              onBeforeAutotable: null

                              onAutotableText: null

                              onTable: null

                              outputImages: true

maxNestedTables: 1

numbers: html: decimalMark: '.'

              thousandsSeparator: ','

        output: decimalMark: '.',

                thousandsSeparator: ','

onCellData: null

onCellHtmlData: null

onIgnoreRow: null

onMsoNumberFormat: null

outputMode: 'file'

pdfmake: enabled: false

        docDefinition: pageOrientation: 'portrait'

                        defaultStyle: font: 'Roboto'

        fonts: {}

tbodySelector: 'tr'

tfootSelector: 'tr'

theadSelector: 'tr'

tableName: 'myTableName'

type: 'csv'

worksheetName: 'WorksheetName'

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放...
    孤魂草阅读 4,423评论 0 0
  • 前言 最先接触编程的知识是在大学里面,大学里面学了一些基础的知识,c语言,java语言,单片机的汇编语言等;大学毕...
    oceanfive阅读 8,390评论 0 7
  • "use strict";function _classCallCheck(e,t){if(!(e instanc...
    久些阅读 6,156评论 0 2
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 9,707评论 0 0
  • 又是一年春天。你还单身吗? 快找个男朋友吧, 找个会说情话的男朋友, 找个只对你说情话的男朋友。 他会在你耳边说:...
    眼睛瞎阅读 4,082评论 3 1