Helpex - Trao đổi & giúp đỡ
Đăng nhập
23

Tôi muốn lấy trang HTML trong PDF.

Sau một số nghiên cứu, tôi tìm thấy plugin pdfJS, nó có một số vấn đề với bootstrap, bố cục sẽ lộn xộn

http://jsfiddle.net/5ud8jkvf/

đây là trò chơi

Tôi thấy bản in mặc định là PDF, kết quả là tuyệt vời

Cách nhận bản in dưới dạng PDF bằng jquery

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

Vì vậy, thay vì khắc phục sự cố cho pdfJS, tôi tự hỏi có cách nào html / jquery để lấy pdf từ bản in dưới dạng pdf không.

HTML cần chuyển đổi sang PDF chỉ là mẫu đơn một trang, cảm ơn rất nhiều

23 hữu ích 3 bình luận 11k xem chia sẻ
4 trả lời 4
Viết câu trả lời
3

Phiên bản hiện tại cho phép lấy blob hoặc bộ đệm mảng của pdf. Điều duy nhất bạn phải làm là cập nhật từ 0.9 lên 1.2.x của thư viện và gọi lưu như thế này

var myBlob;

$('#cmd').click(function () {
    doc.fromHTML($('#content').html(), 15, 15, {
        'width': 170,
            'elementHandlers': specialElementHandlers
    });
    myBlob = doc.save('blob');
});
3 hữu ích 0 bình luận chia sẻ
2

Có thể bạn có thể thử html2canvas (Nó sẽ phân tích cú pháp DOM, Tính toán các kiểu được áp dụng).

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

}());

Tôi tìm thấy cái này ở đây . Vui lòng kiểm tra liên kết nếu bạn muốn biết thêm thông tin.

2 hữu ích 0 bình luận chia sẻ
2

Có vẻ như bạn đang cố in dữ liệu bảng sang Định dạng PDF. Vì vậy, bạn có thể sử dụng Plugin jQuery DataTables .

Datatable cung cấp thư viện nút trong đó bạn có thể sử dụng PDFnút. Nó hỗ trợ cả HTML5 và Flash và loại nút tự động chọn giữa các tùy chọn nút Flash và HTML.

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

Nó cũng cung cấp tính năng xuất excel, bạn chỉ cần thêm excelnút.

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

Tôi đã sử dụng trong ứng dụng của chúng tôi, nó sẽ không tạo ra bất kỳ xung đột nào với bootstrap.

2 hữu ích 0 bình luận chia sẻ
1

Hãy thử jsPDF-AutoTable (plugin jsPDF) , điều này có thể giúp bạn chuyển đổi sang PDF từ HTML như bạn muốn. Kiểm tra bản demo

1 hữu ích 0 bình luận chia sẻ
loading

Đăng nhập để trả lời câu hỏi

Không tìm thấy câu trả lời bạn tìm kiếm? Duyệt qua các câu hỏi được gắn thẻ javascript jquery html css pdf , hoặc hỏi câu hỏi của bạn.

Có thể bạn quan tâm

loading
Hoạt động
Liên quan
Mới tạo