如图,我们要打印主页面中 工单详情部分。
但是由于要打印的部分有样式,并且表格太宽,如果 要直接打印的话,打出来的纸张上字太小且颜色模糊,不易查看。
只要去掉样式,字体会变大,打印出来的效果要好的多。
方案一:我们可以取出要打印的部分,将打印部分填充到弹出的新页面中,然后我就再打印弹出页面即可。
这样做的话,有个缺陷,就是会先把要打印的页面显示出来,然后要用户再次点击打印按键,显示比较啰嗦蛮烦。
方案二:可以在要打印的页面中,嵌入一隐藏的iframe,用于存放要打印的部分代码。
我们点击打印按钮时,实际上是打印这个隐藏iframe的内容。
打印页面代码
- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <title>工单详细信息</title>
- <script type="text/javascript">
- function printPage() {
- //获取当前页的html代码
- var bodyhtml = window.document.body.innerHTML;
- //设置打印开始区域、结束区域
- var startFlag = "<!--startprint-->";
- var endFlag = "<!--endprint-->";
- // 要打印的部分
- var printhtml = bodyhtml.substring(bodyhtml.indexOf(startFlag),
- bodyhtml.indexOf(endFlag));
- // 生成并打印ifrme
- var syfPrint = document.frames[0];
- syfPrint.document.body.innerHTML = printhtml;
- syfPrint.document.execCommand("Print");
- }
- </script>
- </head>
- <body>
- <div id="bd">
- <div id="right_box">
- <a href="#" onclick="javascript:history.back(1); event.returnValue=false">
- << 返回</a><br />
- <!--startprint-->
- //////////////////////要打印的内容部分//////////////////////<br />
- <!--endprint-->
- <input type="button" value="打印" onClick="printPage()" />
-
- </div>
- <iframe src="" width="0" height="0" frameborder="0"></iframe>
- </body>
- </html>
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请
点击举报。