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 相关文章推荐
js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件实例
Apr 29 Javascript
angularjs创建弹出框实现拖动效果
Aug 25 Javascript
Ionic快速安装教程
Jun 03 Javascript
几种tab切换详解
Feb 03 Javascript
js移动端事件基础及常用事件库详解
Aug 15 Javascript
p5.js入门教程之图片加载
Mar 20 Javascript
Array数组对象中的forEach、map、filter及reduce详析
Aug 02 Javascript
如何优雅的在一台vps(云主机)上面部署vue+mongodb+express项目
Jan 20 Javascript
基于javascript的拖拽类封装详解
Apr 19 Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
Jul 07 Javascript
layui 地区三级联动 form select 渲染的实例
Sep 27 Javascript
javascript实现弹出层效果
Dec 10 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
PHP ajax 分页类代码
2008/11/13 PHP
php5.3不能连接mssql数据库的解决方法
2014/12/27 PHP
Laravel学习教程之View模块详解
2017/09/18 PHP
PHP基础之输出缓冲区基本概念、原理分析
2019/06/19 PHP
从父页面读取和操作iframe中内容方法
2009/07/25 Javascript
JS自动适应的图片弹窗实例
2013/06/29 Javascript
Javascript实现简单二级下拉菜单实例
2014/06/15 Javascript
一个获取第n个元素节点的js函数
2014/09/02 Javascript
JavaScript通过元素索引号删除数组中对应元素的方法
2015/03/18 Javascript
JavaScript中this详解
2015/09/01 Javascript
JavaScript来实现打开链接页面的简单实例
2016/06/02 Javascript
jquery.qtip提示信息插件用法简单实例
2016/06/17 Javascript
EasyUI学习之Combobox下拉列表(1)
2016/12/29 Javascript
原生js开发的日历插件
2017/02/04 Javascript
js实现百度搜索提示框
2017/02/05 Javascript
用p5.js制作烟花特效的示例代码
2018/03/21 Javascript
vue.js中npm安装教程图解
2018/04/10 Javascript
在微信小程序中渲染HTML内容的方法示例
2018/09/28 Javascript
vue使用高德地图根据坐标定位点的实现代码
2019/08/22 Javascript
js实现固定区域内的不重叠随机圆
2019/10/24 Javascript
vue3 watch和watchEffect的使用以及有哪些区别
2021/01/26 Vue.js
分享python数据统计的一些小技巧
2016/07/21 Python
Python中格式化format()方法详解
2017/04/01 Python
Python3中正则模块re.compile、re.match及re.search函数用法详解
2018/06/11 Python
Python 3.8新特征之asyncio REPL
2019/05/28 Python
Python如何优雅获取本机IP方法
2019/11/10 Python
python多线程实现同时执行两个while循环的操作
2020/05/02 Python
Python实现查找数据库最接近的数据
2020/06/08 Python
利用Python如何画一颗心、小人发射爱心
2021/02/21 Python
HTML5 video播放器全屏(fullScreen)方法实例
2015/04/24 HTML / CSS
TheFork葡萄牙:欧洲领先的在线餐厅预订平台
2019/05/27 全球购物
人事任命书格式
2014/06/05 职场文书
销售经理助理岗位职责
2015/04/13 职场文书
2016年小学生迎国庆广播稿
2015/12/18 职场文书
关于保护环境的建议书
2019/06/24 职场文书
Javascript中async与await的捕捉错误详解
2022/03/03 Javascript