DIVをPDFファイルとして出力しようとしています。
GitHubのjsPDFの基本的な説明を使用しました
ダウンロードされたファイルには目に見えるデータがないように見えるので、何かを見逃したに違いありません。私はGoogleChromeでOSXMavericksを使用していますが、Safariでも同様の結果が得られます。ファイルは3kb大きい
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.debug.js"></script>
</head>
<body>
<div id="ResultsReport">
<h3>Hello, this is a H3 tag : testing V2 of btnPDF</h3>
<p>a pararaph</p>
</div>
<button id="btnPDF" onclick="btnPDF(code);">Generate PDF</button>
<script>
var code = "UNIQ_ALL";
function btnPDF(code) {
var doc = new jsPDF()
var repPDF = document.getElementById('ResultsReport').innerHTML;
alert("REP=" + repPDF);
doc.text(repPDF);
//doc.text("<h4>This is just a test</h4>");
doc.save(code + '.pdf');
}
</script>
</body>
</html>
そのjspdfライブラリはわかりませんが、これは正常に機能します。
var code = "UNIQ_ALL";
function btnPDF(code) {
var doc = new jsPDF()
var repPDF = document.getElementById('ResultsReport').innerText;
doc.text(repPDF, 10, 10); // <-- add 10, 10
doc.save(code + '.pdf');
}<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.debug.js"></script>
</head>
<body>
<div id="ResultsReport">
<h3>Hello, this is a H3 tag : testing V2 of btnPDF</h3>
<p>a pararaph</p>
</div>
<button id="btnPDF" onclick="btnPDF(code);">Generate PDF</button>
</body>
</html>また、innerHTMLプロパティをinnerTextHTMLの代わりにテキストを抽出するように変更しました。
編集：
古いバージョンのjsPDF（1.0.272）を使用して、この方法を試すことができますfromHTML。私は初期段階のレンダラーだと思うので、派手なHTMLではおそらく機能しないでしょうが、単純なものでは問題ないはずです。
html2canvasは必要ありませんが、必要fromHTMLだaddHTMLと思います。
var code = "UNIQ_ALL";
function btnPDF(code) {
var doc = new jsPDF();
doc.fromHTML($("#ResultsReport")[0], 10, 10);
doc.save(code + '.pdf');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script>
<div id="ResultsReport">
<h3>Hello, this is a H3 tag : testing V2 of btnPDF</h3>
<p>a <b>bold</b> pararaph</p>
</div>
<button id="btnPDF" onclick="btnPDF(code);">Generate PDF</button>この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加