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 相关文章推荐
javascript读取RSS数据
Jan 20 Javascript
用Javascript做flash做的事..才完成的一个类.Auntion Action var 0.1
Feb 23 Javascript
再谈javascript 动态添加样式规则 W3C校检
Dec 25 Javascript
js的隐含参数(arguments,callee,caller)使用方法
Jan 28 Javascript
js实现鼠标经过表格行变色的方法
May 12 Javascript
JS使用cookie实现DIV提示框只显示一次的方法
Nov 05 Javascript
jQuery的promise与deferred对象在异步回调中的作用
May 03 Javascript
[原创]SyntaxHighlighter自动识别并加载脚本语言
Feb 07 Javascript
vue的全局提示框组件实例代码
Feb 26 Javascript
JS实现中英文混合文字溢出友好截取功能
Aug 06 Javascript
Vue组件间的通信pubsub-js实现步骤解析
Mar 11 Javascript
JavaScript实现拖拽效果
Mar 16 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 在windows下配置虚拟目录的方法介绍
2013/06/26 PHP
PHP十六进制颜色随机生成器功能示例
2017/07/24 PHP
在b/s开发中经常用到的javaScript技术
2006/08/23 Javascript
再次更新!MSClass (Class Of Marquee Scroll通用不间断滚动JS封装类 Ver 1.6)
2007/02/05 Javascript
Jquery中dialog属性小记
2010/09/03 Javascript
JQuery中SetTimeOut传参问题探讨
2013/05/10 Javascript
jquery根据name属性查找的小例子
2013/11/21 Javascript
深入分析JQuery和JavaScript的异同
2014/10/23 Javascript
javascript实现动态标签云
2015/10/16 Javascript
基于jQuery和CSS3制作数字时钟附源码下载(jquery篇)
2015/11/24 Javascript
信息页文内画中画广告js实现代码(文中加载广告方式)
2016/01/03 Javascript
jQuery Ajax使用FormData对象上传文件的方法
2016/09/07 Javascript
微信小程序  生命周期详解
2016/10/27 Javascript
实例解析Array和String方法
2016/12/14 Javascript
微信小程序实战之顶部导航栏(选项卡)(1)
2020/06/19 Javascript
vue省市区三联动下拉选择组件的实现
2017/04/28 Javascript
js表单序列化判断空值的实例
2017/09/22 Javascript
浅谈在Vue.js中如何实现时间转换指令
2019/01/06 Javascript
vue 父组件给子组件传值子组件给父组件传值的实例代码
2019/04/15 Javascript
微信小程序全局变量改变监听的实现方法
2019/07/15 Javascript
微信小程序中为什么使用var that=this
2019/08/27 Javascript
Vue router传递参数并解决刷新页面参数丢失问题
2020/12/02 Vue.js
Python求解平方根的方法
2015/03/11 Python
使用Python的Flask框架构建大型Web应用程序的结构示例
2016/06/04 Python
Python编程实现双击更新所有已安装python模块的方法
2017/06/05 Python
pycharm不能运行.py文件的解决方法
2020/02/12 Python
纯CSS和jQuery实现的在页面顶部显示的进度条效果2例(仿手机浏览器进度条效果)
2014/04/16 HTML / CSS
荷兰和比利时时尚鞋店:Van Dalen
2018/04/23 全球购物
世界汽车零件:World Car Parts
2019/09/04 全球购物
医学专业大学生求职的自我评价
2013/11/27 职场文书
《池塘边的叫声》教学反思
2014/04/12 职场文书
大学毕业生求职自荐书
2014/06/05 职场文书
捐书倡议书
2014/08/29 职场文书
冬季作息时间调整通知
2015/04/24 职场文书
《风筝》教学反思
2016/02/23 职场文书
JS实现简单控制视频播放倍速的实例代码
2021/04/18 Javascript