js iframe 打印 打印预览 页眉页脚的设置
1、window.print方式:
//jsp页面 打印按钮: <input type="button" value="打印" onclick="print();"> //js 中: function print(){ window.print(); //style样式中,设置隐藏按钮打印: <style> @media print { .noprint{display:none} } </style>
打印iframe:
<html xmlns="" > <head> <title>标题页</title> <body> <input onclick='prn()' type=button value=print_Iframe$amp;>amp;$lt;br> <iframe id=myframe src=""$amp;>amp;$lt;/iframe> <script> function prn() { var win=window.open("about:blank") //打开一个空页面 win.moveTo(100,100) //移动到指定位置 win.location=document.all.myframe.src //指定页面的内容 win.print() //打印页面 } </script> </body> </html>
2,WebBrowser控件方式
WebBrowser是IE内置的浏览器控件,无需用户 下载 .
页面上加上代码
<object ID="WebBrowser" name="WebBrowser" WIDTH=0 HEIGHT=0 CLASSID='CLSID:8856F961-340A-11D0-A96B-00C04FD705A2'$amp;>amp;$lt;/object>
js:函数中加入代码:
WebBrowser.ExecWB(6,1); //打印设置 WebBrowser.ExecWB(8,1); //打印预览 WebBrowser.ExecWB(7,1); 关于这个组件还有其他的用法,列举如下: WebBrowser.ExecWB(1,1) 打开 WebBrowser.ExecWB(2,1) 关闭现在所有的IE窗口,并打开一个新窗口 WebBrowser.ExecWB(4,1) 保存网页 WebBrowser.ExecWB(6,1) 打印 WebBrowser.ExecWB(7,1) 打印预览 WebBrowser.ExecWB(8,1) 打印页面设置 WebBrowser.ExecWB(10,1) 查看页面属性 WebBrowser.ExecWB(15,1) 好像是撤销,有待确认 WebBrowser.ExecWB(17,1) 全选 WebBrowser.ExecWB(22,1) 刷新 WebBrowser.ExecWB(45,1) 关闭窗体无提示
这种方式打印iframe:
window.parent.document.i1.window.WebBrowser.ExecWB(6, 1);
选择你要的功能。
但是打印是会把整个页面都打印出来的,页面里面有什么东西就打印出来,我们有时候只需要打印数据表格,这时我们就要写一个样式了:把不想打印的部份隐藏起来:
样式内容:
<style type="text/css" media=print>
.noprint...{display : none } </style>
3,打印iframe 中的内容:
主要语句:document.all.iframename.ExecWB(6,1); 便可以只打印iframe中的页面。
document.all.iframename.ExecWB(7,1); 打印预览
…………
使用这种方式打印不需要加:<object ID='WebBrowser' WIDTH=0 HEIGHT=0 CLASSID='CLSID:8856F961-340A-11D0-A96B-00C04FD705A2'$amp;>amp;$lt;/object>
例如:
function printPage() { PageSetup_Null() ; document.all.iframename.ExecWB(6,1); } //打印预览 function printPreview() { document.all.iframename.ExecWB(7,1); }
//设置网页打印的页眉页脚为空 function PageSetup_Null() { try{ var Wsh=new ActiveXObject("WScript.Shell"); Wsh.RegWrite("HKEY_CURRENT_USER\\Software\\Microsoft\\Internet Explorer\\PageSetup\\header",""); //通过修改注册表的方式 页眉和页脚也可以改成你想要的内容 Wsh.RegWrite("HKEY_CURRENT_USER\\Software\\Microsoft\\Internet Explorer\\PageSetup\\footer",""); }catch(e){ alert(e.name+e.message); } }
通过:document.all.iframe.***的方式打印 不仅可以只打印本页面中的iframe 还可以多层嵌套找到要打印的iframe
例如:
first.html
<body> firstpage <input type="button" onclick="printPreview()" value="打印预览"> <input type="button" onclick="printPage()" value="打印"> <br/> <iframe name="iframe" width="500" src="secend.html"$amp;>amp;$lt;/iframe> </body>
secend.html
<body > secendpage <br/> <br/> <iframe name="i1" src="third.html"$amp;>amp;$lt;/iframe> <iframe name="i2" src="thirdd.html"$amp;>amp;$lt;/iframe> <br> </body>
third.html: 随意吧
js:
//打印 function printPage() { //页眉页脚空…… 这里没写了 iframe.document.all.i1.ExecWB(6, 1); " } //打印预览 function printPreview() { iframe.document.all.i1.ExecWB(7, 1); }
于是 以此类推: 就可以实现任意的iframe嵌套打印和打印预览问题了
例如从子页面找父页面打印也可:window.parent.document.all.i1.ExecWB(6, 1);
至于页眉页脚的设置问题我想再细说说
如果你按路径打开注册表 就一目了然
你可以通过更改注册表里的信息改变页眉页脚的任何设置
符号 含义
&w 网页标题
&u 网页地址 (URL)
&d 短日期格式(由“控制面板”中的“区域设置”指定)
&D 长日期格式(由“控制面板”中的“区域设置”指定)
&t 由 “控制面板”中的“区域设置”指定的时间格式
&T 24 小时时间格式
&p 当前页码
&P 总页数
&b 文本右对齐(请把要右对齐的文字放在“&b”之后)
&b&b 文字居中(请把要居中的文字放在“&b”和“&b” 之间)
&& 单个 & 号 (&)
Wsh.RegWrite("HKEY_CURRENT_USER\\Software\\Microsoft\\Internet Explorer\\PageSetup\\header","&b页眉&b"); //设置页眉居中
遗留问题:1,火狐的兼容问题 火狐里 至今没实现打印预览
2,改变注册表设置页眉页脚 毕竟不友好 希望有更好的方式
希望大虾们帮帮忙
遗留问题已解决:
1,火狐 我找了个插件 效果还挺漂亮的 我已经上传了 大家可以下载下来看看
2,没有找到别的方式 最后还是选择了修改注册表
不过document.all.Iframe.ExecWB(6,1,2); 第三个参数设为2 表示等待打印完成
刚开始试的时候发现他并不能等待打印完成再执行我要的函数 后来发现加上setTimeout 就好使了
所以我还是修改注册表 等打印完成后再将注册表改回来
//打印 function printPage() { //设置页眉页脚 PageSetup_Null() document.all.Iframe.ExecWB(6,1,2); //设置页眉页脚 setTimeout(" PageSetup_Default() ",200); }
采用这种方式打印完成后注册表被修改被原来的值就可以了 最然没弄明白为什么要加setTimeout() 但 真的好使 确实实现了 打印后 再把注册表修改为原来值
相关推荐
以上就是使用JavaScript和iframe实现打印预览及自定义页眉页脚的基本步骤。需要注意的是,不同浏览器对CSS打印规则的支持程度可能会有所不同,因此在实际应用中可能需要进行兼容性处理。同时,对于复杂的需求,如...
这个主题“可去除页眉页脚及选择打印部分”主要涉及的是如何在打印预览或实际打印过程中调整设置,以便消除不必要的页眉和页脚,同时选择性地打印文档的特定部分。 页眉和页脚的去除通常可以在各个主流的网页浏览器...
JavaScript(简称JS)提供了多种方式来实现网页内容的打印,包括打印整个页面或页面上的特定区域。本知识点主要介绍如何使用JS调用iframe元素来实现页面内容的打印功能。 ### 知识点一:使用iframe实现区域打印 ...
在网页打印过程中,有时我们可能需要去除不必要的页眉、页脚以及特定的页面元素,以获得更整洁的打印效果。本文将深入探讨如何通过CSS和JavaScript实现这一目标,以优化Web打印体验。 首先,理解CSS媒体查询是关键...
在JavaScript(js)中实现打印和预览功能是一项常见的需求,尤其在Web开发中。本文将详细介绍如何基于JavaScript实现这一功能,并确保其在IE、Firefox和Google等主流浏览器中的兼容性。 首先,我们需要理解...
总结来说,实现跨浏览器的JS打印预览功能,需要考虑不同浏览器的特性,如IE的ActiveXObject,以及利用jQuery插件来提供统一的用户体验。`jquery-print-preview-plugin`这类插件简化了这一过程,提供了丰富的定制选项...
3. 为了优化预览效果,可以使用CSS媒体查询来隐藏非打印相关的元素(如导航栏、侧边栏等),并调整页眉和页脚的样式。 局部预览和打印: 1. 对于表格,我们可以创建一个隐藏的iframe,用于加载需要打印的内容。 2. ...
对于Vue和React这两个流行的JavaScript库,我们可以创建组件来封装`iframe`标签,以便在项目中更方便地使用。下面分别介绍这两种框架的实现方法。 ### Vue实现 在Vue中,我们可以创建一个名为`PdfPreview.vue`的...
通过设置`isFrame: true`,组件会识别并处理页面中的所有iframe,确保它们的内容在打印预览和实际打印过程中都能正确呈现。这对于那些依赖iframe展示关键信息或复杂交互的网站来说,是一项非常重要的增强。 ### 3. ...
总结起来,实现ASP.NET中打印指定div内容并清除页眉页脚的功能,主要是通过JavaScript操作DOM,创建隐藏iframe,将div内容复制到iframe,设置适当的CSS以隐藏默认的打印页眉和页脚,然后调用`window.print()`方法...
本文将深入探讨如何使用JavaScript(js)来实现打印预览,特别是针对IE浏览器的兼容性处理。 首先,JavaScript是Web开发中常用的客户端脚本语言,它可以直接在用户的浏览器上运行,为网页添加交互性。对于打印预览...
在Web开发中,JavaScript(简称JS)打印功能是不可或缺的一部分,尤其对于生成报表或提供打印选项的网页至关重要。本实例提供了具有设置和预览功能的JS打印解决方案,可以帮助开发者更高效地实现这一需求。 首先,...
2. **自定义页眉和页脚**:使用CSS的`@page`规则可以设置打印时的页眉和页脚内容。 3. **分页控制**:通过CSS的`break-before`、`break-after`和`break-inside`属性,可以控制内容在打印时的分页位置。 总结来说,...
在现代Web应用中,JavaScript(JS)经常被用来增强用户体验,其中包括处理各种文件类型,如PDF。本篇文章将深入探讨如何使用JavaScript实现HTML中的PDF文件在线预览、下载以及打印功能。我们将首先介绍相关的...
在探讨如何利用JavaScript调用浏览器的打印模块实现点击按钮时触发自定义函数的过程中,我们首先需要了解浏览器提供的打印API以及如何通过编程方式触发打印任务。现代浏览器通常提供了window.print()方法,该方法...
网页打印和打印预览是网页开发中的...综上所述,网页打印和打印预览涉及到JavaScript的运用、CSS的媒体查询以及第三方库的选择和应用。开发者需要根据项目需求选择合适的方法和工具,以实现高效且用户友好的打印功能。
一种常见的方法是创建一个隐藏的iframe,将需要打印的内容复制到iframe中,然后对iframe进行打印预览。 下面是一个简单的jQuery打印预览实现步骤: 1. **设置HTML结构**:在HTML中,为需要打印的内容添加一个特殊...
为了实现预览效果,可以创建一个隐藏的iframe,将要打印的内容加载到这个iframe中,然后触发其打印功能。 4. **服务器端处理**:在ASP.NET中,你可能需要在服务器端生成报表或文档,比如PDF或Excel。这时,可以使用...
本示例主要探讨如何使用JavaScript结合IFrame技术来实现异步图片上传,并提供预览功能,同时确保兼容Firefox、Chrome和IE9等主流浏览器。 首先,我们需要了解异步上传的基本原理。异步上传,也称为Ajax上传,是指在...