使用 JsPdf AutoTable 在 'd' 和其他字符上设置换行符时出现问题
issue while using JsPdf AutoTable setting newline on 'd' and other characters
我在我的网站中使用带有 AutoTable 的 jsPDF,但在将 Table 导出为 PDF 时出现问题。
当 PDF 的列中的字符串中包含 'd' 个字母时,在 'd' 之后,jsPDF 将通过断开单词并使 PDF 不可读来设置换行符。
还有其他情况,即使使用其他字符,如数字“2”。
有办法解决吗?
这是导出后的样子:
虽然文本中断是:[=15=]
antipasto con gnocco patate + spergola
bimbi verdi + tagliatella ragù
tortello verde + riso
misto carni arrosto con patate e padleda
Alessandra cioccolatina con smarties
我制作 jsPDF 的函数如下所示:
function PDF(id, stat) {
var doc = new jsPDF('l', 'pt', 'a4', true);
var table = '#' + id;
var text = 'Prenotazioni del ' + moment($("#day").attr('data-giorno')).format('DD MMMM YYYY');
doc.setFontSize(18);
doc.text($('#titlepdf').val(), 14, 22);
doc.setFontSize(11);
doc.setTextColor(100);
doc.text(text, 14, 35);
doc.autoTable({
html: table,
startY: 45,
showHead: 'firstPage',
includeHiddenHtml: true,
columnStyles: {
0: {
columnWidth: 80
},
1: {
columnWidth: 50
},
2: {
columnWidth: 50
},
3: {
columnWidth: 50
},
4: {
columnWidth: 100
},
5: {
columnWidth: 200
}
},
headStyles: {
fillColor: [189, 21, 63],
fontSize: 10,
theme: 'grid'
},
styles: {
overflow: 'linebreak',
columnWidth: 'wrap',
font: 'arial',
fontSize: 10,
cellPadding: 8,
overflowColumns: 'linebreak'
}
});
doc.text(stat, 14, doc.autoTable.previous.finalY + 15);
doc.save('prenotazione.pdf');
}
这里是 table:
<table id="tableGiorno" class="table table-hover" style="margin-bottom: 0px; font-size: 12px;">
<thead>
<tr>
<th>Nome</th>
<th>Orario</th>
<th>Tavolo</th>
<th>Coperti</th>
<th>Telefono</th>
<th>Note</th>
</tr>
</thead>
<tbody id="bodyGiorno">
<tr data-tavolo="34">
<td>Igor</td>
<td>14:00</td>
<td>4</td>
<td>1</td>
<td>
<a onclick="event.stopImmediatePropagation();" href="tel:" rel="nofollow"></a>
</td>
<td>Da oggi sono stato fedele grazie alla lorem</td>
</tr>
</tbody>
</table>
通过将 jsPDF 版本更改为最后一个版本 (2.3.1) 解决,我使用的是 1.5.3。
这个问题针对的是较新版本的 jsPDF。如果您升级到最新版本,即 >(2.3),问题将得到解决。
我在我的网站中使用带有 AutoTable 的 jsPDF,但在将 Table 导出为 PDF 时出现问题。
当 PDF 的列中的字符串中包含 'd' 个字母时,在 'd' 之后,jsPDF 将通过断开单词并使 PDF 不可读来设置换行符。
还有其他情况,即使使用其他字符,如数字“2”。
有办法解决吗?
这是导出后的样子:
虽然文本中断是:[=15=]
antipasto con gnocco patate + spergola
bimbi verdi + tagliatella ragù
tortello verde + riso
misto carni arrosto con patate e padleda
Alessandra cioccolatina con smarties
我制作 jsPDF 的函数如下所示:
function PDF(id, stat) {
var doc = new jsPDF('l', 'pt', 'a4', true);
var table = '#' + id;
var text = 'Prenotazioni del ' + moment($("#day").attr('data-giorno')).format('DD MMMM YYYY');
doc.setFontSize(18);
doc.text($('#titlepdf').val(), 14, 22);
doc.setFontSize(11);
doc.setTextColor(100);
doc.text(text, 14, 35);
doc.autoTable({
html: table,
startY: 45,
showHead: 'firstPage',
includeHiddenHtml: true,
columnStyles: {
0: {
columnWidth: 80
},
1: {
columnWidth: 50
},
2: {
columnWidth: 50
},
3: {
columnWidth: 50
},
4: {
columnWidth: 100
},
5: {
columnWidth: 200
}
},
headStyles: {
fillColor: [189, 21, 63],
fontSize: 10,
theme: 'grid'
},
styles: {
overflow: 'linebreak',
columnWidth: 'wrap',
font: 'arial',
fontSize: 10,
cellPadding: 8,
overflowColumns: 'linebreak'
}
});
doc.text(stat, 14, doc.autoTable.previous.finalY + 15);
doc.save('prenotazione.pdf');
}
这里是 table:
<table id="tableGiorno" class="table table-hover" style="margin-bottom: 0px; font-size: 12px;">
<thead>
<tr>
<th>Nome</th>
<th>Orario</th>
<th>Tavolo</th>
<th>Coperti</th>
<th>Telefono</th>
<th>Note</th>
</tr>
</thead>
<tbody id="bodyGiorno">
<tr data-tavolo="34">
<td>Igor</td>
<td>14:00</td>
<td>4</td>
<td>1</td>
<td>
<a onclick="event.stopImmediatePropagation();" href="tel:" rel="nofollow"></a>
</td>
<td>Da oggi sono stato fedele grazie alla lorem</td>
</tr>
</tbody>
</table>
通过将 jsPDF 版本更改为最后一个版本 (2.3.1) 解决,我使用的是 1.5.3。
这个问题针对的是较新版本的 jsPDF。如果您升级到最新版本,即 >(2.3),问题将得到解决。