html 使用iframe标签中的pdfmake生成pdf

cetgtptt 于 2022-12-16 发布在其他

关注(0)|答案(2)|浏览(221)

我有这个JS，我想在一个iframe标签中使用这个JS生成PDF（用PDFmake制作）

function start(){
  var docDefinition = {
  content: [
    {
      table: {
       multiple pages

        headerRows: 1,
        widths: [ '*', 'auto', 100, '*' ],

        body: [
          [ 'First', 'Second', 'Third', 'The last one' ],
          [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ],
          [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ]
        ]
      }
    }
  ]
  };

   pdfMake.createPdf(docDefinition).open();

}

在此iframe中显示PDF：

<frameset cols="25%,*,25%">
      <frame src="">
  </frameset>

当我单击此按钮时：

<button type="submit" name="save" class="btn btn-default" onclick="start();">Savw</button>

谢谢。

Html

来源：https://stackoverflow.com/questions/37449905/generate-pdf-with-pdfmake-in-iframe-tag

2条答案

按热度按时间

knpiaxh11#

我认为我的设置略有不同，但尝试这个-类似的东西为我工作。
首先，在<frame src="" id="foo">上放置一个id，然后将

// pdfMake.createPdf(docDefinition).open();
var doc = pdfMake.createPdf(docDefinition);
var f = document.getElementById('foo');
var callback = function(url) { f.setAttribute('src',url); }
doc.getDataUrl(callback, doc);

getDataUrl函数以生成的url作为参数运行回调函数。该回调应设置框架上的src属性。我的回调还包括console.log(url);，因此我可以看到发生了什么。

赞(0）回复(0）举报 2022-12-16

h6my8fg22#

const targetElement = document.querySelector('#iframeContainer');
    const pdfDocGenerator = pdfMake.createPdf(docDefinition);
    pdfDocGenerator.getBuffer(function (buffer) {
        const dataUrl = URL.createObjectURL(new Blob([buffer], {
            type: "application/pdf"
        }));
        const iframe = document.createElement('iframe');
        iframe.src = dataUrl;
        iframe.width = "300px";
        iframe.height = docDefinition.pageSize.height;
        targetElement.appendChild(iframe);
 
        iframe.contentWindow.print();
    });

赞(0）回复(0）举报 2022-12-16

我来回答

html 使用iframe标签中的pdfmake生成pdf

2条答案

相关问题

热门标签

最新问答