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 相关文章推荐
Js 获取HTML DOM节点元素的方法小结
Apr 24 Javascript
获取URL地址中的文件名和参数的javascript代码
Sep 02 Javascript
iframe 父窗口和子窗口相互的调用方法集锦
Dec 15 Javascript
jQuery取id有.的值的方法
May 21 Javascript
JavaScript中的变量定义与储存介绍
Dec 31 Javascript
javascript变量声明实例分析
Apr 25 Javascript
JS获取本周周一,周末及获取任意时间的周一周末功能示例
Feb 09 Javascript
jQuery为DOM动态追加事件的方法
Feb 16 Javascript
JS组件系列之JS组件封装过程详解
Apr 28 Javascript
详解JavaScript匿名函数和闭包
Jul 10 Javascript
Vue项目利用axios请求接口下载excel
Nov 17 Vue.js
JS+CSS实现动态时钟
Feb 19 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中unserialize返回false的解决方法
2014/09/22 PHP
php将文本文件转换csv输出的方法
2014/12/31 PHP
php通过排列组合实现1到9数字相加都等于20的方法
2015/08/03 PHP
php+ajax+json 详解及实例代码
2016/12/12 PHP
PHP 实现重载
2021/03/09 PHP
用JavaScript事件串连执行多个处理过程的方法
2007/03/09 Javascript
Javascript小技巧之生成html元素
2014/05/15 Javascript
在JavaScript中call()与apply()区别
2016/01/22 Javascript
JS动态创建元素的两种方法
2016/04/20 Javascript
跨域资源共享 CORS 详解
2016/04/26 Javascript
如何在Angular.JS中接收并下载PDF
2016/11/26 Javascript
jstree的简单实例
2016/12/01 Javascript
JavaScript实现选中文字提示新浪微博分享效果
2017/06/15 Javascript
phantomjs导出html到pdf的方法总结
2017/10/19 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
2018/10/30 Javascript
ionic使用angularjs表单验证(模板验证)
2018/12/12 Javascript
nodejs读取图片返回给浏览器显示
2019/07/25 NodeJs
JS箭头函数和常规函数之间的区别实例分析【 5 个区别】
2020/05/27 Javascript
Vue封装全局过滤器Filters的步骤
2020/09/16 Javascript
python encode和decode的妙用
2009/09/02 Python
python3中bytes和string之间的互相转换
2017/02/09 Python
Pycharm学习教程(5) Python快捷键相关设置
2017/05/03 Python
python实现用户答题功能
2018/01/17 Python
值得收藏,Python 开发中的高级技巧
2018/11/23 Python
pycharm专业版远程登录服务器的详细教程
2020/09/15 Python
css3实现文字首尾衔接跑马灯的示例代码
2020/10/16 HTML / CSS
美国精品家居用品网站:US-Mattress
2016/08/24 全球购物
材料物理专业大学毕业生求职信
2013/10/15 职场文书
经贸日语毕业生自荐信
2013/11/03 职场文书
鉴定评语大全
2014/05/05 职场文书
品质口号大全
2014/06/17 职场文书
社区助残日活动总结
2014/08/29 职场文书
领导班子党的群众路线对照检查材料
2014/09/25 职场文书
信用卡工资证明范本
2014/10/17 职场文书
团组织推优材料
2014/12/29 职场文书
银行文明优质服务培训心得体会
2016/01/09 职场文书