如何在jsPDF autotable中识别HTML类或特定单元格

时间:2017-11-14 13:45:21

标签: jspdf jspdf-autotable

抱歉,我的英语不太好。我有一个关于jsPDF autotable的问题。 经过数小时的挫折后,我的代码运行并创建了一个PDF文件。

这是我的代码:

    $('#printBtn').on('click', function() {
    var pdf = new jsPDF('p', 'pt', 'a4');
    var res = pdf.autoTableHtmlToJson(document.getElementById("tablePrint"));

    pdf.autoTable(res.columns, res.data, {
        theme : 'plain',
        styles: {
            fontSize: 12
        },
        showHeader: 'never'
    });

    pdf.save("test.pdf");
});

我在github repo中搜索并在examples.js中找到了一个代码片段,它可以帮助我,但我不知道我的工作方式是正确的....

        parsedInput: function (cell, data) {
            if (data.column.dataKey === 'name') {
                cell.styles.fontStyle = 'bold';
            }
        }

我有一张桌子,例如

<table>
<tbody>
<tr>
<td class="hrow">15.11.2016</td>
<td class="hrow">11:20</td>
<td class="hrow"></td>
</tr>
<tr>
<td></td>
<td>Musterfrau</td>
<td>Mustermann</td>
</tr>
<tr>
<td></td>
<td>Musterfrau XYZ</td>
<td>XXX</td>
</tr>
<tr>
<td class="hrow">15.11.2016</td>
<td class="hrow">11:20</td>
<td class="hrow"></td>
</tr>
<tr>
<td></td>
<td>Musterfrau</td>
<td>Mustermann</td>
</tr>
<tr>
<td></td>
<td>Musterfrau XYZ</td>
<td>XXX</td>
</tr>
<tr>
<td></td>
<td>Example cell</td>
<td>acusduhfsd</td>
</tr>
<tr>
<td class="hrow">15.11.2016</td>
<td class="hrow">11:20</td>
<td class="hrow"></td>
</tr>
<tr>
<td></td>
<td>Musterfrau dfg</td>
<td>Mustermann dfhgd</td>
</tr>
<tr>
</tbody>
</table>

我希望行分别为“hrow”类的单元格以粗体显示内部文本。

我怎么能达到这个目标?

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

尝试这样的事情:

pdf.autoTable(res.columns, res.data, {
    createdCell: function(cell, data) {
        var tdElement = cell.raw;
        if (tdElement.classList.contains('hrow')) {
            cell.styles.fontStyle = 'bold';
        }
    }
});

未经测试,但应使css类为hrow的单元格为粗体。