jsPDF 是一个基于 HTML5 的客户端解决方案,用于生成各种用途的 PDF 文档。使用方法很简单,只要引入 jsPDF 库,然后调用内置的方法就可以了。浏览器兼容性: IE 10, Firefox 3+, Chrome, Safari 3+, Opera,未来将兼容 IE 10 以下版本,对于 IE10 以下的版本会使用 Downloadify 来实现文件下载功能。

您可能感兴趣的相关文章

插件下载      效果演示

使用示例

1、文本

var doc = new jsPDF();

doc.text(20, 20, 'This is the default font.');

doc.setFont("courier");
doc.setFontType("normal");
doc.text(20, 30, 'This is courier normal.'); doc.setFont("times");
doc.setFontType("italic");
doc.text(20, 40, 'This is times italic.'); doc.setFont("helvetica");
doc.setFontType("bold");
doc.text(20, 50, 'This is helvetica bold.'); doc.setFont("courier");
doc.setFontType("bolditalic");
doc.text(20, 60, 'This is courier bolditalic.');

2、图片

// You'll need to make your image into a Data URL
// Use http://dataurl.net/#dataurlmaker
var imgData = 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/4ge....../2Q=='; var doc = new jsPDF(); doc.setFontSize(40);
doc.text(35, 25, "Octonyan loves jsPDF");
doc.addImage(imgData, 'JPEG', 15, 40, 180, 180);

3、HTML

var doc = new jsPDF();

// We'll make our own renderer to skip this editor
var specialElementHandlers = {
'#editor': function(element, renderer){
return true;
}
}; // All units are in the set measurement for the document
// This can be changed to "pt" (points), "mm" (Default), "cm", "in"
doc.fromHTML($('#render_me').get(0), 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});

本文链接:赞!jsPDF – 基于 HTML5 的强大 PDF 生成工具

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

赞!jsPDF – 基于 HTML5 的强大 PDF 生成工具的更多相关文章

  1. jsPDF – 基于 HTML5 的强大 PDF 生成工具

    jsPDF 是一个基于 HTML5 的客户端解决方案,用于生成各种用途的 PDF 文档. 使用方法很简单,只要引入 jsPDF 库,然后调用内置的方法就可以了. 米扑科技项目用到了HHTML5生成PD ...

  2. 基于数据库的代码自动生成工具,生成JavaBean、生成数据库文档、生成前后端代码等(v6.0.0版)

    TableGo v6.0.0 版震撼发布,此次版本更新如下: 1.UI界面大改版,组件大调整,提升界面功能的可扩展性. 2.新增BeautyEye主题,界面更加清新美观,也可以通过配置切换到原生Jav ...

  3. 基于HTML5功能强大的滑块幻灯片

    分享一款功能强大的HTML5滑块幻灯片.这是一款基于jQuery+HTML5实现的图片切换幻灯片代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <section cla ...

  4. 基于HTML5自定义文字背景生成QQ签名档

    分享一款利用HTML5实现的自定义文字背景应用,首先我们可以输入需要显示的文字,并且为该文字选择一张背景图片,背景图片就像蒙版一样覆盖在文字上.点击生成QQ签名档即可将文字背景融为一体生成另外一张图片 ...

  5. 基于HTML5及WebGl下生成的json格式的工控SCADA风机叶轮旋转

    突然有个想法,如果能把一些用到不同的知识点放到同一个界面上,并且放到一个盒子里,这样我如果要看什么东西就可以很直接显示出来,而且这个盒子一定要能打开.我用HT实现了我的想法,代码一百多行,这么少的代码 ...

  6. 一款基于HTML5的Web 3D开发工具

    在我们协助客户进行3D应用的开发过程中,客户遇到的最头疼的问题是如何在短时间内学会使用TWaver 3D引擎,以及使用TWaver 3D来创建和导入项目所需的各种3D业务模型.由于项目涵盖的行业繁多. ...

  7. Animo.js :一款管理 CSS 动画的强大的小工具

    Animo.js 是一个功能强大的小工具,用于管理 CSS 动画.它的特色功能包括像堆栈动画,创建跨浏览器的模糊,设置动画完成的回调等等.Animo 还包括惊人的 animate.css,为您提供了近 ...

  8. 18个基于 HTML5 Canvas 开发的图表库

    如今,HTML5 可谓如众星捧月一般,受到许多业内巨头的青睐.很多Web开发者也尝试着用 HTML 5 来制作各种各样的富 Web 应用.HTML 5 规范引进了很多新特性,其中之一就是 Canvas ...

  9. 基于HTML5技术的电力3D监控应用(二)

    上篇介绍了我们电力项目的基本情况,我们选用HTML5技术还是顶着很大压力,毕竟HTML5技术性能行不行,浏览器兼容性会不会有问题,这些在项目选型阶段还是充满疑惑,项目做到现在终于快收尾了我们才敢松口气 ...

随机推荐

  1. Androd开发之广告栏设计

    对于做Android开发的工程师对于这个效果的实现一定不陌生,本篇我将带领大家先简单实现这个效果,再为大家介绍一下其中的原理,方便新手学习,老手复习,内容简单易懂,没有基础一样学习,不扯没用的了,下面 ...

  2. C#预处理器指令 ,你造吗??? (●'◡'●)

    什么是c#预处理指令?? 用于在 C# 源代码中嵌入的编译器命令. C#预处理器指令有哪些?? ↓↓↓这些就是预处理器指令啦 下面我们一一道来(●'◡'●) 1.#if ,#elif,#else,en ...

  3. 使用webpack打包ThinkPHP的资源文件

    使用webpack打包ThinkPHP的资源文件 利用自己的空余时间一直在维护http://www.wx2share.com这个小网站,全是一个人在弄,由于只租得起虚拟空间,所以后台采用了简单方便的T ...

  4. Deep learning:四十七(Stochastic Pooling简单理解)

    CNN中卷积完后有个步骤叫pooling, 在ICLR2013上,作者Zeiler提出了另一种pooling手段(最常见的就是mean-pooling和max-pooling),叫stochastic ...

  5. Oracle RMAN 备份一例

    Oracle RMAN备份一例: Solaris 10 + Oracle 11.2.0.3 Shell:csh,安装有bash,脚本调用bash 备份策略:周日0级备份,周一~周六1级备份,每6小时备 ...

  6. GIF录制神器GifCam

    前几天偶然看到一款神器:GifCam! GifCam是什么? 一款录制gif动画图片的小软件,小到不足一兆. 使用方法(简单到不可思议) 百度 GifCam 下载: 不用安装,直接打开gifcam: ...

  7. JQuery实现仿sina新浪微博新鲜事滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 基于HT for Web矢量实现HTML5文件上传进度条

    在HTML中,在文件上传的过程中,很多情况都是没有任何的提示,这在体验上很不好,用户都不知道到时有没有在上传.上传成功了没有,所以今天给大家介绍的内容是通过HT for Web矢量来实现HTML5文件 ...

  9. vue之自定义指令directive

    <template> <div> <input v-model="dir1" v-my-directive1="dir1"/> ...

  10. Error: pathspec '*' did not match any file(s) known to git.

    git切换分支报错 error: pathspec 'develop' did not match any file(s) known to git. 解决办法如下: plumm@MACY-PC MI ...