jsPDF не игнорирует div
Я пытаюсь игнорировать div при экспорте в PDF через jsPDF. Вот мой код:
HTML:
<div id="print-this">
<p>Text to print</p>
<div id="ignore">
<p>Text To ignore</p>
</div>
<p>More text to print</p>
</div>
<button id="cmd">Print</button>
Jquery:
$(function () {
$('#cmd').click(function () {
var doc = new jsPDF();
var elementHandler = {
'#ignore': function (element, renderer) {
return true;
}
};
doc.addHTML($('#print-this')[0], 15, 15, {
'background': '#fff',
}, function() {
doc.save('sample.pdf');
});
});
});
Вместо игнорирования определенного идентификатора он экспортирует все под id="print-this".
1 ответ
Решение
Супер грязный, но делает свое дело:
$(function() {
$('#cmd').click(function() {
$('#ignore').hide(); //before the addHTML()
var doc = new jsPDF();
doc.addHTML($('#print-this')[0], 15, 15, {
'background': '#fff',
}, function() {
doc.save('sample.pdf');
});
$('#ignore').show(); //and directly after its finished
});
});
$("#btnPrint").click(function () {
$(".canhide").hide();
makePDF();
setTimeout(function () {
$(".canhide").show();
}, 5000);
});
У меня возникла проблема при создании нескольких страниц, просто $(".canhide").show();
после makePDF()
не скрывает ненужный контент. setTimeout
функция спасла меня.
Ты можешь попробовать data-html2canvas-ignore="true"
,
<div id="print-this">
<p>Text to print</p>
<div data-html2canvas-ignore="true"><!-- id="ignore" -->
<p>Text To ignore</p>
</div>
<p>More text to print</p>
</div>
<button id="cmd">Print</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js"
integrity="sha384-NaWTHo/8YCBYJ59830LTz/P4aQZK1sS0SneOgAvhsIl3zBu8r9RevNg5lHCHAuQ/"
crossorigin="anonymous"></script>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>