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 相关文章推荐
用javascript获得地址栏参数的两种方法
Nov 08 Javascript
[原创]站长必须要知道的javascript广告代码
May 30 Javascript
js使用html()或text()方法获取设置p标签的显示的值
Aug 01 Javascript
Google Maps API地图应用示例分享
Oct 23 Javascript
JavaScript中字符串拼接的基本方法
Jul 07 Javascript
js图片翻书效果代码分享
Aug 20 Javascript
详解JavaScript函数
Dec 01 Javascript
JS 拼凑字符串的简单实例
Sep 02 Javascript
详谈jQuery中的一些正则匹配表达式
Mar 08 Javascript
JS去掉字符串前后空格或去掉所有空格的用法
Mar 25 Javascript
微信小程序下拉框功能的实例代码
Nov 06 Javascript
JavaScript函数定义方法实例详解
Mar 05 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
建站常用13种PHP开源CMS比较
2009/08/23 PHP
Zend Framework 2.0事件管理器(The EventManager)入门教程
2014/08/11 PHP
php使用cookie显示用户上次访问网站日期的方法
2015/01/26 PHP
解决laravel 5.1报错:No supported encrypter found的办法
2017/06/07 PHP
PHP实现基本留言板功能原理与步骤详解
2020/03/26 PHP
JS 容错处理代码, 屏蔽错误信息
2021/03/09 Javascript
JavaScript中yield实用简洁实现方式
2010/06/12 Javascript
jQuery EasyUI API 中文文档 可调整尺寸
2011/09/29 Javascript
jquery实现页面图片等比例放大缩小功能
2014/02/12 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
2014/06/15 Javascript
ionic 上拉菜单(ActionSheet)实例代码
2016/06/06 Javascript
微信小程序 图片宽高自适应详解
2017/05/11 Javascript
浅谈React中的元素、组件、实例和节点
2018/02/27 Javascript
JavaScript实现的DOM树遍历方法详解【二叉DOM树、多叉DOM树】
2018/05/07 Javascript
JavaScript实现小球沿正弦曲线运动
2020/09/07 Javascript
微信小程序云开发之新手环境配置
2019/05/16 Javascript
Element-ui中元素滚动时el-option超出元素区域的问题
2019/05/30 Javascript
基于Element封装一个表格组件tableList的使用方法
2020/06/29 Javascript
vue实现页面切换滑动效果
2020/06/29 Javascript
Python中字典的setdefault()方法教程
2017/02/07 Python
Python中input与raw_input 之间的比较
2017/08/20 Python
Python中序列的修改、散列与切片详解
2017/08/27 Python
一个月入门Python爬虫学习,轻松爬取大规模数据
2018/01/03 Python
python SMTP实现发送带附件电子邮件
2018/05/22 Python
Python subprocess模块功能与常见用法实例详解
2018/06/28 Python
windows下pycharm安装、创建文件、配置默认模板
2018/07/31 Python
python IDLE 背景以及字体大小的修改方法
2019/07/12 Python
在Python中用GDAL实现矢量对栅格的切割实例
2020/03/11 Python
一文彻底解决HTML5页面中长按保存图片功能
2019/06/10 HTML / CSS
Big Green Smile德国网上商店:提供各种天然产品
2018/05/23 全球购物
小学教师事迹材料
2014/01/13 职场文书
保护环境演讲稿
2014/05/10 职场文书
消防标语大全
2014/06/07 职场文书
安全口号大全
2014/06/21 职场文书
培训通知
2015/04/17 职场文书
Python生成九宫格图片的示例代码
2021/04/14 Python