javascript 打印预览的实现

引自:http://blog.csdn.net/lsj19830812/archive/2007/10/25/1843578.aspx
 
a.jsp是要打印的页面

< html >
< head >
< script  language ="javascript" >
function fmtPrint(printPlace,w,h){
var sarg=new Array();
var sdata=document.all.item(printPlace);
sarg[0]=sdata.outerHTML;
window.showModalDialog("print.jsp",sarg,"dialogWidth:"+w+"px;dialogHeight:"+h+"px;center:yes;help:no;status:no;resizable:yes");
return;
}

</ script >
</ head >
< body >
< div  id ="printPlace" >
希望打印的内容写在里面
...........
...........
...........
...........
...........
</ div >
< img  onClick ="fmtPrint('printPlace', 800, 600);"  name ="Print"  border ="0"  style ="cursor:hand"  src ="images/dayin.gif" >
</ body >
</ html >

print.jsp是打印预览页面

< html >
< head >
< base  target ="_self" >
< script  language ="javascript" >
<!--
var dada = dialogArguments;
var da1 = dada[1]; 
function loaddatas(){
var tagBody;
var pf = document.all.item('printfield');
pf.insertAdjacentHTML('beforeEnd',da1); 
    
var removeRadio = document.all.tags("input");
for(var i=0; i<removeRadio.length; i++){
tagBody = removeRadio[i];
if (tagBody.getAttribute("type") == "radio"||tagBody.getAttribute("type") == "checkbox")
{
tagBody.style.display = 'none';
}

}

    
var removeHref = document.all.tags("A");
for(var i=0; i<removeHref.length; i++){
tagBody = removeHref[i];
if (tagBody.getAttribute("href") != null) 
{
tagBody.setAttribute("href","javascript:void(0)");
}

}

    
var removeImg = document.all.tags("img");
for(var i=0; i<removeImg.length; i++){
tagBody = removeImg[i];
if ( tagBody.name != 'printButton' ) 
{
tagBody.style.display = 'none';
}

}

return;
}

function startprint(){
document.all.item("startbutt").style.display='none';
window.print();
window.close();
return;
}

//-->
</ script >  
</ head >
< body  leftMargin =0  topMargin =0  marginheight ="0"  marginwidth ="0"  onload ="javascript:loaddatas();"  style ="word-break:break-all" >
< table  align ="center" >
< tr >
< td  align ="center"  id ="printfield" ></ td >
</ tr >
</ table >
< table  width ="100%"  id ="startbutt" >
< tr >
< td  align =center >
< a  onclick ="javascript:startprint();" >< img  border ="0"  name ="printButton"  src ="images/dayin.gif"  style ="vertical-align:middle; cursor:hand" ></ a >
</ td >
</ tr >
</ table >
</ body >
</ html >
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
实现PDF的预览打印有多种方法,以下是其中两种常用的方法: 1. 使用PDF.js库 PDF.js是Mozilla开发的一个用于在浏览器中渲染PDF文档的JavaScript库。它可以直接在网页中展示PDF文件,且不需要使用Adobe Reader等第三方插件。可以通过以下步骤使用PDF.js实现PDF的预览打印: - 在HTML文件中引入PDF.js库: ``` <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.8.335/pdf.min.js"></script> ``` - 使用JavaScript代码加载PDF文档并渲染: ``` // 获取PDF文档 const url = 'path/to/your/pdf/file.pdf'; const loadingTask = pdfjsLib.getDocument(url); // 渲染PDF文档 loadingTask.promise.then(function(pdf) { // 获取第一页 pdf.getPage(1).then(function(page) { const scale = 1.5; const viewport = page.getViewport({ scale: scale }); // 创建一个canvas元素显示PDF内容 const canvas = document.createElement('canvas'); const context = canvas.getContext('2d'); canvas.height = viewport.height; canvas.width = viewport.width; // 将PDF内容渲染到canvas中 const renderContext = { canvasContext: context, viewport: viewport }; page.render(renderContext); // 将canvas添加到DOM中 document.body.appendChild(canvas); }); }); // 打印PDF文档 function printPdf() { window.print(); } ``` 2. 使用iframe元素 另一种实现PDF预览打印的方法是使用iframe元素。可以通过以下步骤实现: - 在HTML文件中创建一个iframe元素: ``` <iframe id="pdf-iframe" src="path/to/your/pdf/file.pdf"></iframe> ``` - 使用JavaScript代码控制iframe元素: ``` // 获取iframe元素 const iframe = document.getElementById('pdf-iframe'); // 打印PDF文档 function printPdf() { iframe.contentWindow.print(); } ``` 这种方法的优点是简单易用,但是需要使用第三方插件(如Adobe Reader)来展示PDF文件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值