Me gustaría obtener la página HTML en el PDF.

Después de algunos estudios, encontré el complemento pdfJS, tiene algún problema con bootstrap, el diseño será desordenado

http://jsfiddle.net/5ud8jkvf/

Aquí está el violín

Encontré que la impresión predeterminada como resultado PDF es genial

enter image description here

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');
});

Entonces, en lugar de solucionar el problema de pdfJS, me pregunto si hay una forma html / jquery para obtener el pdf de la impresión como pdf.

La necesidad de HTML para convertir a PDF es solo un formulario de solicitud de una página, muchas gracias

23
user782104 13 may. 2016 a las 13:07

4 respuestas

La mejor respuesta

La versión actual permite obtener el blob o el arraybuffer del pdf. Lo único que tiene que hacer es actualizar de 0.9 a 1.2.x de la biblioteca y llamar a guardar así

var myBlob;

$('#cmd').click(function () {
    doc.fromHTML($('#content').html(), 15, 15, {
        'width': 170,
            'elementHandlers': specialElementHandlers
    });
    myBlob = doc.save('blob');
});
3
Richard Burkhardt 16 may. 2016 a las 06:37

Parece que está intentando imprimir los datos de la tabla en formato PDF, por lo que puede usar DataTables jQuery Plugin.

Las tablas de datos proporcionan biblioteca en la que puede utilizar el botón PDF. Su soporte tanto HTML5 como Flash y el tipo de botón selecciona automáticamente entre las opciones de botón Flash y HTML.

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

También proporciona la función de exportación de Excel, solo necesita agregar el botón excel.

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

Ya lo he usado en nuestra aplicación, no hará ningún conflicto con bootstrap.

2
Mohd Sayeed 16 may. 2016 a las 06:40

Puede ser que pueda probar html2canvas (analizará DOM, calculará los estilos aplicados).

(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
    }); 
}

}());

Encontré esto aquí. Por favor, consulte el enlace si desea más información.

2
vijaykumar 16 may. 2016 a las 06:26

Pruebe jsPDF-AutoTable (jsPDF plugin), esto puede ayudarlo a convertir a PDF desde HTML como usted querer. Consulte la demo

1
Raj_King 23 may. 2016 a las 05:05