htmljspdf_基于jquery与html5 canvas生成pdf插件jspdf为什么导出页面内容不全

‘壹’ 如何将 HTML 页面的一部分转成 pdf

1、用浏览器转换

这个方法是最简单、高效的，安装了360浏览器或者火狐及Chrome谷歌浏览器就可以轻松实现。以360浏览器为例，在浏览器的右上角点击“文件”按钮，如下图：

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

本文实例讲述了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='http://www.jb51.net/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>
运行效果：
更多关于JavaScript相关内容可查看本站专题：《JavaScript扩展技巧总结》、《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
您可能感兴趣的文章:jsPDF导出pdf示例jsPDF生成pdf后在网页展示实例使用jspdf生成pdf报表phonegap教程使用jspdf库在应用中生成pdf文件(pdf生成方法)JS导出PDF插件的方法(支持中文、图片使用路径)js插件方式打开pdf文件(浏览器pdf插件分享)用Javascript检查Adobe
PDF插件是否安装的实现代码纯js实现html转pdf的简单实例(推荐)基于Phantomjs生成PDF的实现方法JavaScript+Java实现HTML页面转为PDF文件保存的方法JavaScript代码生成PDF文件的方法

‘叁’ jsPDF 将html代码中的table导出为pdf文件怎么弄

jsPDF 将html代码中的table导出为pdf文件怎么弄
有如下方法：
1、如果你电脑上安装了office2007/2010，其中的word或EXCEL可以直接保存为PDF格式。
2、如果你电脑上安装安装的是office2003，可以下载安装adobe acrobat，acrobat可以在加载生成PDF的插件。
3、利用任意一款PDF打印机（如pdffactory pro），然后将word文件“打印”成PDF文件。

‘肆’ 前端HTML页面转PDF（html2canvas+jspdf）

utils - htmlToPdf.js

main.js

1、如果在多个页面使用，给函数定义一个参数，参数为要导出页面部分的id。

将 '#pdfDom' 替换为参数即可
2、将导出文件的名称也作为参数传入函数

此种方式也可用于vue，尝试后可行，需要调节部分参数，但毕竟不太合适。
jQuery不需要调节。

https://github.com/zhangshaoliang/downLoadPDF

vue方式
jQuery方式

目前项目使用的是前端加后端方式，前端提供模板，echarts图表的话需要转为base64发送给后台。后台使用iText。目前存在的问题是后台不支持css3语法，只支持到css2，所以复杂的样式页面显示错乱，考虑个别页面使用纯前端实现。

网站导航

‘伍’ vue中实现html页面导出word和pdf的办法

1.使用预先写好的与html相似的word文档模板，将用户输入的数据与读取出来的模板结合生成指定名称的docx文件
vue+elementUI导出数据为word文档
2.使用Jquery插件和file-save来生成word文档
vue 前端导出word、excel、pdf

1.使用html2canvas和JsPDF来生成pdf文件
html2canvas生成截图后，用JsPDF转为pdf文件
上面有，这是运用插件截图可能会产生的问题的解决方案
2.调用浏览器的打印方法生成pdf文件
vue 项目导出pdf两种方式

‘陆’ 基于jquery与html5 canvas生成pdf插件jspdf为什么导出页面内容不全

H5e教育HTML5开发解答
JScript codevar canvas = document.getElementById("mycanvas");
var img = canvas.toDataURL("image/png");

document.write('<img src="'+img+'"/>');
打印是浏览器的事。用JS调用也是调用浏览器的功能，这种情况直接按CTRL+P去处理。
至于PDF，装软件，只要能打印的都可以通过软件生成PDF。
若想在HTML5里用纯代码实现导出PDF是实现不了的。

‘柒’ 如何在网页中显示PDF文件

使用js插件
其中实现阅读pdf文件的js插件很多，比如：pdf.js：是一个技术原型主要用于在 HTML5 平台上展示 PDF 文档，无需任何本地技术支持；jsPDF：是一个使用Javascript语言生成PDF的开源库

这个 PDFObject.js，是一个 JavaScript 库用来在HTML中动态嵌入 PDF 文档。
js代码：
<script type="text/javascript">
window.onload = function (){
var success = new PDFObject({ url: "sample.pdf" }).embed();
};
</script>

OK,这样就可以了。只要把地址写对即可。
若我在某一个div中加载pdf咋办呢？看官网，发现embed()方法可以有参数的，无参数是指body，有参数是具体的某一个位置。
<script type="text/javascript">
window.onload = function (){
var success = new PDFObject({ url: "sample.pdf" }).embed(“div的id”);
};
</script>

当然,其中还可以进一步设置参数,比如你想以多少秒的速度预览,有css,无css等
具体的官网如下：http$://$www.$pdfobject$.com/
请去掉$这个符号

导航:首页 > 文档加密 > htmljspdf

htmljspdf

与htmljspdf相关的资料