javascript 打印预览的实现

最新推荐文章于 2023-09-28 20:10:20 发布

habaishi

最新推荐文章于 2023-09-28 20:10:20 发布

阅读量469

点赞数

分类专栏： javascript 文章标签： javascript border input null

javascript 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现网页内容打印的方法。通过定义特定的HTML元素，并利用window.showModalDialog弹出打印预览窗口，实现了网页内容的选择性打印。同时，文章提供了完整的代码示例，包括主页面和打印预览页面的实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

引自：http://blog.youkuaiyun.com/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 >