Подтвердить что ты не робот

Как получить печать в формате PDF с помощью jquery

Я хотел бы получить HTML-страницу в формате PDF.

После некоторых исследований я нашел плагин pdfJS, у него есть некоторые проблемы с загрузкой, макет будет грязным

http://jsfiddle.net/5ud8jkvf/

вот скрипка

Я нашел печать по умолчанию, так как результат PDF отличный

введите описание изображения здесь

var doc = new jsPDF();
var specialElementHandlers = {
    '#editor': function (element, renderer) {
        return true;
    }
};

$('#cmd').click(function () {
    doc.fromHTML($('#content').html(), 15, 15, {
        'width': 170,
            'elementHandlers': specialElementHandlers
    });
    doc.save('sample-file.pdf');
});

Итак, вместо того, чтобы фиксировать проблему для pdfJS, я задаюсь вопросом, есть ли способ html/jquery, чтобы получить pdf файл из печати в формате pdf.

HTML-код для конвертирования в PDF - это только одностраничная форма приложения, спасибо большое

4b9b3361

Ответ 1

Текущая версия позволяет получить blob или arraybuffer в формате pdf. Единственное, что вам нужно сделать, это обновить от 0.9 до 1.2.x библиотеки и вызвать save, как это.

var myBlob;

$('#cmd').click(function () {
    doc.fromHTML($('#content').html(), 15, 15, {
        'width': 170,
            'elementHandlers': specialElementHandlers
    });
    myBlob = doc.save('blob');
});

Ответ 2

Может быть, вы можете попробовать html2canvas (он будет анализировать DOM, Calculate применяемые стили).

(function(){
var 
 form = $('.form'),
 cache_width = form.width(),
 a4  =[ 595.28,  841.89];  // for a4 size paper width and height

$('#create_pdf').on('click',function(){
 $('body').scrollTop(0);
 createPDF();
});
//create pdf
function createPDF(){
 getCanvas().then(function(canvas){
  var 
  img = canvas.toDataURL("image/png"),
  doc = new jsPDF({
          unit:'px', 
          format:'a4'
        });     
        doc.addImage(img, 'JPEG', 20, 20);
        doc.save('techumber-html-to-pdf.pdf');
        form.width(cache_width);
 });
}

// create canvas object
function getCanvas(){
 form.width((a4[0]*1.33333) -80).css('max-width','none');
 return html2canvas(form,{
     imageTimeout:2000,
     removeContainer:true
    }); 
}

}());

Я нашел здесь здесь. Пожалуйста, проверьте ссылку, если хотите получить дополнительную информацию.

Ответ 3

Кажется, вы пытаетесь распечатать данные таблицы в формате PDF. Таким образом вы можете использовать DataTables плагин jQuery.

Datatables предоставляют button библиотеку, в которой вы можете использовать кнопку PDF. Его поддержка как HTML5, так и Flash и кнопки автоматически выбираются между параметрами кнопки Flash и HTML.

$('#myTable').DataTable( {
buttons: [
    'pdf'
]
} );

Он также предоставляет функцию экспорта excel, вам просто нужно добавить кнопку excel.

$('#myTable').DataTable( {
buttons: [
    'copy', 'excel', 'pdf'
]
} );

Я уже использовал в нашем приложении, он не будет вступать в конфликт с загрузкой.

Ответ 4

Попробуйте jsPDF-AutoTable (плагин jsPDF), это может помочь вам конвертировать в PDF из HTML, как вы хотите. Просмотрите демонстрацию