如何将样式DIV保存为PDF ?
How can I save a styled DIV as a PDF
嗨,有一种方法来保存一个样式的div作为PDF使用Javascript或HTML?
我有一个样式的DIV,我希望能够保存为PDF与点击一个按钮,我也希望它保持它的样式。
如何做到这一点?
感谢 <style>
.spOutputbox {
margin: 5px 0 0 40px;
padding: 10px;
width: 378px;
height: 568px;
border-radius: 5px;
font-size: 15px;
color: #333;
box-shadow: 0 1px 5px rgba(0,0,0,0.25);
background: #f5f5f5;
text-align: center;
float: left;
}
.outline {
border: 1px dotted #000;
}
.spOutputbox .ribbon {
margin-top: 20px;
width: 100%;
height: 40px;
border-top: 1px dotted #000;
border-bottom: 1px dotted #000;
}
.spOutputbox .tableTitle {
margin: 30px 0;
font-size: 30px;
font-weight: normal;
}
.spOutputbox .pname {
margin: 10px 0;
font-size: 18px;
font-weight: normal;
}
</style>
<div class="spOutputbox">
<div class="outline">
<div class="ribbon"></div>
<div class="spContent">
<div class="tableTitle">Table 1</div>
<div class="pname">Name 1</div>
<div class="pname">Name 2</div>
<div class="pname">Name 3</div>
<div class="pname">Name 4</div>
</div>
</div>
<button id="makepd">generate PDF</button>
也许Html2Canvas可以帮到你:
使用这个库,您应该能够转换画布中的div,然后,使用类似示例的代码:
var imgData = canvas.toDataURL('image/jpeg');
var doc = new jsPDF('landscape');
doc.addImage(imgData, 'JPEG', 15, 40, 180, 180);
doc.save('sample-file.pdf');
另存为pdf格式
要了解更多信息,请查看这篇jsPDF文章
相关文章:
- 如何在jquery、javascript、HTML5中以base64字符串保存为(PDF、doc、xls、png.)
- 在jspdf中使用addHTML保存pdf文件失败
- 是否将PDF文件保存在其他应用程序可以访问的PhoneGap应用程序中?(iOS)
- 使用JS将网页直接保存为PDF
- 将字节数组保存到Titanium中的pdf文件中
- 循环浏览 base64 图像并保存为 pdf
- 使用 TideSDK 保存一个 pdf 文件
- PHP 如何将 php 表结果保存到.PDF文件中
- 在 C# 中查看 PDF 文件并阻止保存和打印选项
- 如何将 html 页面的一部分保存到客户端 (javascript) 或服务器端 asp.net 的图像或 pdf
- 将网页转换为PDF并将其保存在服务器中 - JS或PHP
- 需要使用 JSPDF 和自动表 JS 使用另存为弹出窗口将 PDF 保存到本地驱动器,同时将 HTML 表数据导出为 P
- 如何保存.pdf没有 url 的浏览器窗口中弹出的文件
- 使用 Internet Explorer 10 及更低版本保存 Base64 编码的 PDF
- 将PDF文件从Node.js服务器保存到PhoneGap应用程序
- 保存PDF“;斑点”;在谷歌脚本中
- 删除打印/保存等时嵌入PDF
- 保存服务返回的PDF
- 将flot图表保存为图像或pdf格式
- Javascript会自动将pdf保存到某个位置