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 相关文章推荐
javascript prototype 原型链
Mar 12 Javascript
锋利的jQuery 要点归纳(三) jQuery中的事件和动画(下:动画篇)
Mar 24 Javascript
深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制
Jun 10 Javascript
JS实现两表格里数据来回转移的方法
May 28 Javascript
AngularJS中实现用户访问的身份认证和表单验证功能
Apr 21 Javascript
详解Angular.js中$http拦截器的介绍及使用
Jul 04 Javascript
如何用vue-cli3脚手架搭建一个基于ts的基础脚手架的方法
Dec 12 Javascript
基于Echarts图表在div动态切换时不显示的解决方式
Jul 20 Javascript
解决vue axios跨域 Request Method: OPTIONS问题(预检请求)
Aug 14 Javascript
js+css实现扇形导航效果
Aug 18 Javascript
js中Map和Set的用法及区别实例详解
Feb 15 Javascript
vue报错function () { [native code] },无法出现我们想要的内容 Unknown custom element
Apr 11 Vue.js
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
phpmyadmin 常用选项设置详解版
2010/03/07 PHP
PHP中的output_buffering详细介绍
2014/09/27 PHP
php写入数据到CSV文件的方法
2015/03/14 PHP
php实现的简单检验登陆类
2015/06/18 PHP
PHP会话处理的10个函数
2015/08/11 PHP
Node.js中使用mongoskin操作mongoDB实例
2014/09/28 Javascript
解决jquery中动态新增的元素节点无法触发事件问题的两种方法
2015/10/30 Javascript
解析javascript瀑布流原理实现图片滚动加载
2016/03/10 Javascript
js组件SlotMachine实现图片切换效果制作抽奖系统
2016/04/17 Javascript
jQuery实现的网格线绘制方法
2016/06/20 Javascript
Jquery实现遮罩层的简单实例(就是弹出DIV周围都灰色不能操作)
2016/07/14 Javascript
分类解析jQuery选择器
2016/11/23 Javascript
angularjs ocLazyLoad分步加载js文件实例
2017/01/17 Javascript
Node.js获取前端ajax提交的request信息
2017/02/20 Javascript
详解打造 Vue.js 可复用组件
2017/03/24 Javascript
Bootstrap fileinput文件上传组件使用详解
2017/06/06 Javascript
Vue 2中ref属性的使用方法及注意事项
2017/06/12 Javascript
详解基于Angular4+ server render(服务端渲染)开发教程
2017/08/28 Javascript
详解如何在angular2中获取节点
2017/11/23 Javascript
vuex的module模块用法示例
2018/11/12 Javascript
详解django2中关于时间处理策略
2019/03/06 Python
解决django服务器重启端口被占用的问题
2019/07/26 Python
python3 BeautifulSoup模块使用字典的方法抓取a标签内的数据示例
2019/11/28 Python
Python中格式化字符串的四种实现
2020/05/26 Python
如何基于python实现年会抽奖工具
2020/10/20 Python
2014年党课学习心得体会
2014/07/08 职场文书
2014党员四风对照检查材料思想汇报
2014/09/17 职场文书
教师自我剖析材料(群众路线)
2014/09/29 职场文书
师德师风个人总结
2015/02/06 职场文书
涨价通知
2015/04/23 职场文书
研讨会通知
2015/04/27 职场文书
法律意见书范文
2015/06/04 职场文书
canvas多重阴影发光效果实现
2021/04/20 Javascript
PyQt5爬取12306车票信息程序的实现
2021/05/14 Python
解析python中的jsonpath 提取器
2022/01/18 Python
Springboot集成kafka高级应用实战分享
2022/08/14 Java/Android