JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】


Posted in Javascript onFebruary 06, 2018

本文实例讲述了JS实现的将html转为pdf功能。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html>
<head>
 <title>jsPDF插件</title>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <script src="https://code.jquery.com/jquery-git.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>
</head>
<body>
 <p class="pdf-wrapper" ="to-pdf">HTML content...<h1>中文</h1>
  中国,汉字,测试:合同 模版 中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国</br>中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国中国....................<br/>
  中国,汉字,测试:合同 模版 ...................<br/>
   计费 接口 ....................<br/>
  <img src='https://3water.com/images/logo.gif'/>
 </p>
 <script type="text/javascript">
  var pdf = new jsPDF('p','pt','a4');
  pdf.internal.scaleFactor = 1;
  var options = {
    pagesplit: true
  };
  //$('.pdf-wrapper')
  pdf.addHTML(document.body,options,function() {
   pdf.save('web1111.pdf');
  });
 </script>
</body>
</html>

运行效果:

JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】

JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】

更多关于JavaScript相关内容可查看本站专题:《JavaScript扩展技巧总结》、《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JQuery 将元素显示在屏幕的中央的代码
Feb 27 Javascript
使用javascript实现页面定时跳转总结篇
Sep 21 Javascript
ie下$.getJSON出现问题的解决方法
Feb 12 Javascript
理解JavaScript中Promise的使用
Jan 18 Javascript
详解Angular2中的编程对象Observable
Sep 17 Javascript
Vue.js tab实现选项卡切换
May 16 Javascript
使用InstantClick.js让页面提前加载200ms
Sep 12 Javascript
浅谈vue中.vue文件解析流程
Apr 24 Javascript
微信小程序实现循环动画效果
Jul 16 Javascript
Vue实现商品详情页的评价列表功能
Sep 04 Javascript
vue学习笔记之作用域插槽实例分析
Feb 01 Javascript
js 图片懒加载的实现
Oct 21 Javascript
20行JS代码实现粘贴板复制功能
Feb 06 #Javascript
JS中offset和匀速动画详解
Feb 06 #Javascript
Bootstrap实现的表格合并单元格示例
Feb 06 #Javascript
JavaScript实现获取select下拉框中第一个值的方法
Feb 06 #Javascript
AngularJS实时获取并显示密码的方法
Feb 06 #Javascript
详解使用React进行组件库开发
Feb 06 #Javascript
fullpage.js最后一屏滚动方式
Feb 06 #Javascript
You might like
dede3.1分页文字采集过滤规则详说(图文教程)续二
2007/04/03 PHP
php miniBB中文乱码问题解决方法
2008/11/25 PHP
PHP图片处理类 phpThumb参数用法介绍
2012/03/11 PHP
MySQL的FIND_IN_SET函数使用方法分享
2012/03/27 PHP
PHP基本语法总结
2014/09/06 PHP
php源码的安装方法和实例
2019/09/26 PHP
Add a Picture to a Microsoft Word Document
2007/06/15 Javascript
js实现翻页后保持checkbox选中状态的实现方法
2012/11/03 Javascript
jquery.idTabs 选项卡使用示例代码
2014/09/03 Javascript
微信小程序开发实战教程之手势解锁
2016/11/18 Javascript
浅谈javascript中的 “ &amp;&amp; ” 和 “ || ”
2017/02/02 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
2017/07/18 Javascript
jQuery实现新闻播报滚动及淡入淡出效果示例
2018/03/23 jQuery
微信小程序WebSocket实现聊天对话功能
2018/07/06 Javascript
VueJS 取得 URL 参数值的方法
2019/07/19 Javascript
优雅的使用javascript递归画一棵结构树示例代码
2019/09/22 Javascript
js实现烟花特效
2020/03/02 Javascript
[09:37]DOTA2卡尔工作室 英雄介绍圣堂刺客篇
2013/06/13 DOTA
pycharm 使用心得(六)进行简单的数据库管理
2014/06/06 Python
python处理文本文件并生成指定格式的文件
2014/07/31 Python
Django中使用Celery的教程详解
2018/08/24 Python
Python列表常见操作详解(获取,增加,删除,修改,排序等)
2019/02/18 Python
python给list排序的简单方法
2020/12/10 Python
几款主流好用的富文本编辑器(所见即所得常用编辑器)介绍
2021/03/17 Javascript
Gap中国官网:美式休闲风服饰
2017/02/05 全球购物
小橄榄树:Le Petit Olivier
2018/04/23 全球购物
关于递归的一道.NET面试题
2013/05/12 面试题
求职简历的自我评价怎样写好
2013/10/07 职场文书
销售人员求职的自我评价分享
2014/03/15 职场文书
我们的节日国庆活动方案
2014/08/19 职场文书
新兵入伍心得体会
2014/09/04 职场文书
房屋租房协议书范本
2014/12/04 职场文书
2019年共青团工作条例最新版
2019/11/12 职场文书
js中Object.create实例用法详解
2021/10/05 Javascript
python 详解turtle画爱心代码
2022/02/15 Python
nginx lua 操作 mysql
2022/05/15 Servers