2015-12-22 25 views
0

我试图在jspdf site上重新创建pdf预览,这样我就可以在闲暇时以编程方式测试一些东西。纵观该网站的源代码,在html是:在jsfiddle中嵌入具有datauri src的元素?

<iframe src="datauri:application/pdf;base64,blahblahblah"> 
    <html> 
     <body> 
      <embed src="same as above" type="application/pdf" /> 
     </body> 
    </html> 
</iframe> 

的jsfiddle没有发挥好与嵌入式<html>所以我已经试过的各种组合:

//Cannot read property "canvas" of undefined 
<img id="pdf" /> 
$("#pdf").attr("src", doc.output("datauristring")); 

... 

//Cannot read property "canvas" of undefined 
<embed id="pdf" type="application/pdf" /> 
document.querySelector("#pdf").src = doc.output("datauristring"); 

我也尝试推行画布和绘图datauri详细here,但那也没有工作。这是我的fiddle

回答

0

它在与本地服务器http-server工作,我认为jsfiddle只是奇怪。

var doc = new jsPDF("landscape"); 
doc.text(20, 20, "hi"); 
var data = doc.output("datauristring"); 
document.querySelector("#iframe").src = data; 
document.querySelector("#pdf").src = data; 

... 

<!doctype html> 
<html> 
    <head> 
     <link rel="stylesheet" href="/style.css" type="text/css" /> 
     <script src="/node_modules/jspdf/dist/jspdf.min.js"></script> 
    </head> 

    <body> 

     <iframe id="iframe"> 
      <html> 
       <body> 
        <embed type="application/pdf" id="pdf" />    
       </body> 
      </html> 
     </iframe> 

     <embed type="application/pdf" id="pdf" /> 

     <script src="/app.js"></script> 

    </body> 
</html>