Question

我使用this code将表格保存为CSV（我稍微改了一下以包含标题并排除隐藏的行）。表格单元格中的某些换行符会丢失，但我想将它们保留为\ r \ n。网上有很多类似的问题，但我仍然觉得jQuery有点神秘，不知何故我无法找到解决这个希望简单问题的方法。

function exportTableToCSV($table, delimiter) {

    var $rows = $table.find('tr:visible');

    // Temporary delimiter characters unlikely to be typed by keyboard
    // This is to avoid accidentally splitting the actual contents
    var tmpColDelim = String.fromCharCode(11), // vertical tab character
    tmpRowDelim = String.fromCharCode(0), // null character

    // actual delimiter characters for CSV format
    colDelim = '"' + delimiter + '"',
    rowDelim = '"\r\n"',

    // Grab text from table into CSV formatted string
    csv = '"' + $rows.map(function (i, row) {
        var $row = $(row),
        $cols = $row.find('td, th');

        return $cols.map(function (j, col) {
            var $col = $(col),
            text = $col.text();

            return text.replace(/"/g, '""'); // escape double quotes

        }).get().join(tmpColDelim);

    }).get().join(tmpRowDelim)
    .split(tmpRowDelim).join(rowDelim)
    .split(tmpColDelim).join(colDelim) + '"',

    // Data URI
    csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv);
    return csvData;
}

Answer 1

这是br元素被剥离的地方：

var $col = $(col),
    text = $col.text();

一种解决方案是用标记替换它们，然后用\r\n替换标记：

var $col, text;

$col = $(col).clone();
$col.find("br").replaceWith("<div>{{MARKER}}</div>");
text = $col.text().replace(/{{MARKER}}/g, "\r\n");

这

克隆元素，以便我们可以在不更改文档的情况下进行更改
查找其中的所有br元素
用div替换每个{{MARKER}}
获取文本，其中包含{{MARKER}}，其中br曾是
用{{MARKER}}

\r\n

＆＃13;

function exportTableToCSV($table, delimiter) {

    var $rows = $table.find('tr:visible');

    // Temporary delimiter characters unlikely to be typed by keyboard
    // This is to avoid accidentally splitting the actual contents
    var tmpColDelim = String.fromCharCode(11), // vertical tab character
    tmpRowDelim = String.fromCharCode(0), // null character

    // actual delimiter characters for CSV format
    colDelim = '"' + delimiter + '"',
    rowDelim = '"\r\n"',

    // Grab text from table into CSV formatted string
    csv = '"' + $rows.map(function (i, row) {
        var $row = $(row),
        $cols = $row.find('td, th');

        return $cols.map(function (j, col) {
            var $col, text;
          
            $col = $(col).clone();
            $col.find("br").replaceWith("<div>{{MARKER}}</div>");
            text = $col.text().replace(/{{MARKER}}/g, "\r\n");

            return text.replace(/"/g, '""'); // escape double quotes

        }).get().join(tmpColDelim);

    }).get().join(tmpRowDelim)
    .split(tmpRowDelim).join(rowDelim)
    .split(tmpColDelim).join(colDelim) + '"',

    // Data URI
    csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv);
    return csvData;
}

snippet.log(exportTableToCSV($("table"), ","));

＆＃13;

table {
  border-collapse: collapse;
  border: 1px solid black;
}
td {
  border: 1px solid black;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Temporary snippet object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<table>
  <tbody>
    <tr>
      <td>Testing</td>
      <td>One</td>
      <td>Two and<br>three</td>
    </tr>
  </tbody>
</table>

＆＃13;

如何使用jQuery用\ r \ n替换所有<br/>

1 个答案: