JavaScript代码生成PDF文件的方法


Posted in Javascript onFebruary 26, 2016

如何使用js生成pdf文件呢?相信很多朋友都被这一问题迷惑着,下面由三水点靠木小编通过本文给大家简单介绍下。

可以使用javascript生成PDF的类库?jsPDF,先下载jsPDF-0.9.0rc2下载地址:;请点这里 ,以下是完整实例代码:

<!doctype>
<html>
<head>
<title>jsPDF</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<script type="text/javascript" src="js/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery-ui-1.8.17.custom.min.js"></script>
<script type="text/javascript" src="../jspdf.js"></script> 
</head> 
<body>
<iframe frameborder="0" width="500" height="400"></iframe>
<script>
$(document).ready(function() {
var pdf = new jsPDF('p','in','letter')
, sizes = [12, 16, 20]
, fonts = [['Times','Roman'],['Helvetica',''], ['Times','Italic']]
, font, size, lines
, margin = 0.5 // inches on a 8.5 x 11 inch sheet.
, verticalOffset = margin
, loremipsum = ' ipsum dolor sit amet, consectetur adipiscing elit. Phasellus id eros turpis. Vivamus tempor urna vitae sapien mollis molestie. Vestibulum in lectus non enim bibendum laoreet at at libero. Etiam malesuada erat sed sem blandit in varius orci porttitor. Sed at sapien urna. Fusce augue ipsum, molestie et adipiscing at, varius quis enim. Morbi sed magna est, vel vestibulum urna. Sed tempor ipsum vel mi pretium at elementum urna tempor. Nulla faucibus consectetur felis, elementum venenatis mi mollis gravida. Aliquam mi ante, accumsan eu tempus vitae, viverra quis justo.\n\nProin feugiat augue in augue rhoncus eu cursus tellus laoreet. Pellentesque eu sapien at diam porttitor venenatis nec vitae velit. Donec ultrices volutpat lectus eget vehicula. Nam eu erat mi, in pulvinar eros. Mauris viverra porta orci, et vehicula lectus sagittis id. Nullam at magna vitae nunc fringilla posuere. Duis volutpat malesuada ornare. Nulla in eros metus. Vivamus a posuere libero.'
// Margins:
pdf.setDrawColor(0, 255, 0)
.setLineWidth(1/72)
.line(margin, margin, margin, 11 - margin)
.line(8.5 - margin, margin, 8.5-margin, 11-margin)
// the 3 blocks of text
for (var i in fonts){
if (fonts.hasOwnProperty(i)) {
font = fonts[i]
size = sizes[i]
lines = pdf.setFont(font[0], font[1])
.setFontSize(size)
.splitTextToSize(loremipsum, 7.5)
// Don't want to preset font, size to calculate the lines?
// .splitTextToSize(text, maxsize, options)
// allows you to pass an object with any of the following:
// {
// 'fontSize': 12
// , 'fontStyle': 'Italic'
// , 'fontName': 'Times'
// }
// Without these, .splitTextToSize will use current / default
// font Family, Style, Size.
//console.log(lines);
pdf.text(0.5, verticalOffset + size / 72, lines)
verticalOffset += (lines.length + 0.5) * size / 72
}
}
var string = pdf.output('datauristring');
$('iframe').attr('src', string);
});
</script>
</body>
</html>

以上内容给大家介绍了JavaScript代码生成PDF文件的方法,希望对大家有所帮助!

Javascript 相关文章推荐
google地图的路线实现代码
Aug 20 Javascript
img onload事件绑定各浏览器均可执行
Dec 19 Javascript
点击隐藏页面左栏或右栏实现js代码
Apr 01 Javascript
JavaScript将页面表格导出为Excel的具体实现
Dec 27 Javascript
javascript使用window.open提示“已经计划系统关机”的原因
Aug 15 Javascript
Javascript保存网页为图片借助于html2canvas库实现
Sep 05 Javascript
javascript中的Base64、UTF8编码与解码详解
Mar 18 Javascript
如何把vuejs打包出来的文件整合到springboot里
Jul 26 Javascript
ant design实现圈选功能
Dec 17 Javascript
React中使用UMEditor的方法示例
Dec 27 Javascript
JS几个常用的函数和对象定义与用法示例
Jan 15 Javascript
vuex中store存储store.commit和store.dispatch的用法
Jul 24 Javascript
JavaScript 定时器 SetTimeout之定时刷新窗口和关闭窗口(代码超简单)
Feb 26 #Javascript
自动完成的搜索框javascript实现
Feb 26 #Javascript
jQuery实现控制文字内容溢出用省略号(…)表示的方法
Feb 26 #Javascript
js去字符串前后空格的实现方法
Feb 26 #Javascript
js判断鼠标位置是否在某个div中的方法
Feb 26 #Javascript
超实用的JavaScript表单代码段
Feb 26 #Javascript
理解javascript中Map代替循环
Feb 26 #Javascript
You might like
德生S2000收音机更换“钕铁硼”全频扬声器
2021/03/02 无线电
php中iconv函数使用方法
2008/05/24 PHP
通俗易懂的php防注入代码
2010/04/07 PHP
解析php中curl_multi的应用
2013/07/17 PHP
PHP微信支付实例解析
2016/07/22 PHP
Yii2语言国际化的配置教程
2018/08/19 PHP
php实现微信公众号创建自定义菜单功能的实例代码
2019/06/11 PHP
laravel框架中表单请求类型和CSRF防护实例分析
2019/11/23 PHP
jquery tools之tabs 选项卡/页签
2009/07/25 Javascript
让iframe子窗体取父窗体地址栏参数(querystring)
2009/10/13 Javascript
基于Jquery的温度计动画效果
2010/06/18 Javascript
理解JAVASCRIPT中hasOwnProperty()的作用
2013/06/05 Javascript
nodejs下打包模块archiver详解
2014/12/03 NodeJs
jQuery 选择器(61种)整理总结
2016/09/26 Javascript
AngularJS动态绑定HTML的方法分析
2016/11/07 Javascript
Node.js安装配置图文教程
2017/05/10 Javascript
微信小程序实现带参数的分享功能(两种方法)
2019/05/17 Javascript
js实现三角形粒子运动
2020/09/22 Javascript
[05:09]第二届DOTA2亚洲邀请赛决赛日比赛集锦:iG 3:0 OG夺冠
2017/04/05 DOTA
[01:04:22]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 IG vs EG
2018/04/01 DOTA
python转换字符串为摩尔斯电码的方法
2015/07/06 Python
Python编程把二叉树打印成多行代码
2018/01/04 Python
python爬取足球直播吧五大联赛积分榜
2018/06/13 Python
解读python如何实现决策树算法
2018/10/11 Python
python3.x实现base64加密和解密
2019/03/28 Python
python3 logging日志封装实例
2020/04/08 Python
python 实现图片裁剪小工具
2021/02/02 Python
html5 Canvas画图教程(1)—画图的基本常识
2013/01/09 HTML / CSS
西班牙网上书店:Casa del Libro
2016/11/01 全球购物
2014年学生会工作总结
2014/11/07 职场文书
2015年人力资源部工作总结
2015/04/30 职场文书
钢琴师观后感
2015/06/12 职场文书
装修公司管理制度
2015/08/05 职场文书
使用Python脚本对GiteePages进行一键部署的使用说明
2021/05/27 Python
css3手动实现pc端横向滚动
2022/06/21 HTML / CSS
SpringBoot深入分析讲解监听器模式下
2022/07/15 Java/Android