jsPDF生成pdf后在网页展示实例


Posted in Javascript onJanuary 16, 2014
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=GBK"> 
<title>jsPDF</title> 
<script type="text/javascript" src="jspdf.js"></script> 
<script type="text/javascript"> 
window.onload=function(){ 
var doc = new jsPDF(); 
//var doc = new jsPDF('landscape');//横排 doc.setProperties({//设置文档属性 
title: 'Title', 
subject: 'This is the subject', 
author: 'Dragon', 
keywords: 'javascript, web 2.0, ajax', 
creator: 'MEEE' 
}); 
doc.setTextColor(0,255,0); 
doc.setFontSize(22); 
doc.setFont("times"); 
doc.setFontType("italic"); 
doc.text(20, 20, 'Hello world!');//添加文字 
doc.setTextColor(255,0,0); 
doc.setFontSize(16); 
doc.setFont("helvetica"); 
doc.setFontType("bold"); 
doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.'); 
doc.addPage();//添加页 
doc.setLineWidth(1);//设置线宽 
doc.setDrawColor(0,255,0);//设置画笔颜色 
doc.setFillColor(255,0,0);//设置填充颜色 
doc.line(60, 20, 115, 60);//画线,两个坐标 
doc.rect(100, 50, 20, 30); //画矩形,左上角坐标,宽度,高度,只有边框 
doc.ellipse(20, 20, 20, 10, 'F');//画椭圆,中心点坐标,宽度,高度,只有边 
doc.circle(120, 20, 20, 'FD');//画圆,中心点坐标,半径,边框和填充都有 
doc.triangle(100, 100, 110, 100, 120, 130, 'FD'); 
//doc.output('datauri');//直接输出为新的web页 
document.getElementById("iframe123").src = doc.output('datauristring');//在iframe中显示 
} 
</script> 
</head> 
<body> 
<iframe id="iframe123" frameborder="0" width="400" height="500"></iframe> 
</body> 
</html>
Javascript 相关文章推荐
jQuery实现长文字部分显示代码
May 13 Javascript
jquery 检测元素是否存在的实例代码
Nov 19 Javascript
JavaScript 实现鼠标拖动元素实例代码
Feb 24 Javascript
Javascript获取CSS伪元素属性的实现代码
Sep 28 Javascript
JavaScript 实现打印,打印预览,打印设置
Dec 30 Javascript
百度地图给map添加右键菜单(判断是否为marker)
Mar 04 Javascript
深入理解Ajax的get和post请求
Jun 02 Javascript
Javasript设计模式之链式调用详解
Apr 26 Javascript
使用Phantomjs和Node完成网页的截屏快照的方法
Jul 16 Javascript
jQuery实现checkbox全选、反选及删除等操作的方法详解
Aug 02 jQuery
原生js实现贪食蛇小游戏的思路详解
Nov 26 Javascript
javascript设计模式 ? 策略模式原理与用法实例分析
Apr 21 Javascript
在firefox和Chrome下关闭浏览器窗口无效的解决方法
Jan 16 #Javascript
js获取某元素的class里面的css属性值代码
Jan 16 #Javascript
JS可以控制样式的名称写法一览
Jan 16 #Javascript
js仿百度贴吧验证码特效实例代码
Jan 16 #Javascript
js中传递特殊字符(+,&amp;)的方法
Jan 16 #Javascript
利用浏览器全屏api实现js全屏
Jan 16 #Javascript
JQuery文本改变触发事件如聚焦事件、失焦事件
Jan 15 #Javascript
You might like
非常好的php目录导航文件代码
2006/10/09 PHP
隐性调用php程序的方法
2009/03/09 PHP
探讨PHP删除文件夹的三种方法
2013/06/09 PHP
linux下实现定时执行php脚本
2015/02/13 PHP
PHP实现图片批量打包下载功能
2017/03/01 PHP
PHP删除数组中指定下标的元素方法
2018/02/03 PHP
Laravel框架分页实现方法分析
2018/06/12 PHP
PHP CURL中传递cookie的方法步骤
2019/05/09 PHP
面向对象的javascript(笔记)
2009/10/06 Javascript
jquery autocomplete自动完成插件的的使用方法
2010/08/07 Javascript
JS面向对象编程 for Cookie
2010/09/19 Javascript
一个JavaScript函数把URL参数解析成Json对象
2014/09/24 Javascript
重新理解JavaScript的六种继承方式
2017/03/24 Javascript
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
2017/05/08 jQuery
nodejs实现的连接MySQL数据库功能示例
2018/01/25 NodeJs
JS处理一些简单计算题
2018/02/24 Javascript
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
2018/09/04 Javascript
Python3里的super()和__class__使用介绍
2015/04/23 Python
整理Python 常用string函数(收藏)
2016/05/30 Python
特征脸(Eigenface)理论基础之PCA主成分分析法
2018/03/13 Python
python使用PIL模块获取图片像素点的方法
2019/01/08 Python
python实现画五角星和螺旋线的示例
2019/01/20 Python
python面向对象实现名片管理系统文件版
2019/04/26 Python
django echarts饼图数据动态加载的实例
2019/08/12 Python
哈工大自然语言处理工具箱之ltp在windows10下的安装使用教程
2020/05/07 Python
CSS3中:nth-child和:nth-of-type的区别深入理解
2014/03/10 HTML / CSS
Html5踩坑记之mandMobile使用小记
2020/04/02 HTML / CSS
英国网络托管和域名领导者:Web Hosting UK
2017/10/15 全球购物
Hotels.com南非:酒店预订
2017/11/02 全球购物
德国玩具商店:Planet Happy DE
2021/01/16 全球购物
MYSQL支持事务吗
2013/08/09 面试题
thinkphp5 redis缓存新增方法实例讲解
2021/03/24 PHP
群众路线剖析材料怎么写
2014/10/09 职场文书
SQLServer中exists和except用法介绍
2021/12/04 SQL Server
使用Python解决图表与画布的间距问题
2022/04/11 Python