当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 利用WebBrowser彻底解决Web打印问题（包括后台打印）

Javascript
JavaScript 复制功能代码 兼容多浏览器
图片与文字半透明效果 鼠标移上不透明
javascript 模拟Marquee文字向左均匀滚动代码
纯CSS 链接悬停提示效果代码
JS、CSS文字切换，定时交替，代码精简
Javascript 仿歌词智能滚动代码
javascript 表单中浏览文件的“浏览”按钮修改
让你的网站可编辑的实现js代码
Javascript var变量隐式声明方法
JS CSS制作饱含热情的镶边文字闪烁特效
Js 实现文字爬楼滚动效果 结合文本框
随日期每天自动变换的文本的js特效
一个链接按两种方式打开两个网址的方法
Js文字背景行如流水特效
让链接必须按先后顺序点击的JS代码
单选按钮决定链接的网址
JavaScript 点击插入文字
获取网站跟路径的javascript代码(站点及虚拟目录)
JS 用6N±1法求素数 实例教程
javascript 添加和移除函数的通用方法

No. « 263 264 265 266 »

技术文章搜索

关键字

Javascript 中的 利用WebBrowser彻底解决Web打印问题（包括后台打印）

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-09-12   浏览: 331 ::
收藏到网摘: n/a

BS架构下的打印大家是怎么解决的呢，我最近作了一个项目正好负责这一块，不仅要求打印页面的特定部分，还要求有后台的批量打印，在网上查了一些资料，最后终于解决了。

抱着“取之于众 服务于众”的思想，我总结了一下，把它拿到网上来与大家分享，希望能帮助遇到类似问题的朋友。
我主要使用了IE内置的WebBrowser控件，无需用户下载和安装。WebBrowser有很多功能，除打印外的其他功能就不再赘述了，你所能用到的打印功能也几乎全部可以靠它完成，下面的问题就是如何使用它了。先说显示后打印，后面说后台打印。
1．首先引入一个WebBrowser在需要打印的页面，可以直接添加：
<object id="WebBrowser" classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height="0" width="0">
</object>
到页面，或者使用JavaScript在需要的时候临时添加也可以：
document.body.insertAdjacentHTML("beforeEnd",
"<object id=\"WebBrowser\" width=0 height=0 \
classid=\"clsid:<st1:chmetcnv tcsc="0" numbertype="1" negative="False" hasspace="False" sourcevalue="8856" unitname="F" w:st="on">8856F</st1:chmetcnv>961<st1:chmetcnv tcsc="0" numbertype="1" negative="True" hasspace="False" sourcevalue="340" unitname="a" w:st="on">-340A</st1:chmetcnv>-11D0-A96B<st1:chmetcnv tcsc="0" numbertype="1" negative="True" hasspace="False" sourcevalue="0" unitname="C" w:st="on">-00C</st1:chmetcnv>04FD<st1:chmetcnv tcsc="0" numbertype="1" negative="False" hasspace="False" sourcevalue="705" unitname="a" w:st="on">705A</st1:chmetcnv>2\">");
2 .页面设置和打印预览
如下所示，直接调用即可
document.all.WebBrowser.ExecWB(6,6) 直接打印
document.all.WebBrowser.ExecWB(8,1) 页面设置
document.all.WebBrowser.ExecWB(7,1) 打印预览
或者：
execScript("document.all.WebBrowser.ExecWB 7, 1","VBScript");
3 隐藏不打印的页面元素和分页
CSS 有个Media 属性，可以分开设置打印和显示的格式。
如 <style media="print" type="text/css"> …</style> 中间的格式将只在打印时起作用，不会影响显示界面。
所以可以设定
<style media="print" type="text/css">
.Noprint{display:none;}
.PageNext{page-break-after: always;}
</style>
然后给不想打印的页面元素添加： class="Noprint" ，那就不会出现在打印和打印预览中了。
想分页的地方添加： <div class="PageNext"></div> 就可以了。
4．打印页面的特定部分
我是通过将需要打印的特定部分另建一个页面，然后装入主页面的一个IFrame中，再调用IFrame的打印方法，只打印IFrame中的内容实现的。
如：
<iframe style="visibility: visible" name="FrameId" width="100%" height="30%" src="NeedPrintedPage.asp"></iframe>
下面的pringFrame js函数将只打印Iframe中的内容，可以直接引用使用,如printFrame(FrameId);
window.print = printFrame;
// main stuff
function printFrame(frame, onfinish) {
if ( !frame ) frame = window;
function execOnFinish() {
switch ( typeof(onfinish) ) {
case "string": execScript(onfinish); break;
case "function": onfinish();
}
if ( focused && !focused.disabled ) focused.focus();
}
if (( frame.document.readyState !== "complete") &&( !frame.document.confirm("The document to print is not downloaded yet! Continue with printing?") ))
{
execOnFinish();
return;
}
var eventScope = printGetEventScope(frame);
var focused = document.activeElement;
window.printHelper = function() {
execScript("on error resume next: printWB.ExecWB 6, 1", "VBScript");
printFireEvent(frame, eventScope, "onafterprint");
printWB.outerHTML = "";
execOnFinish();
window.printHelper = null;
}
document.body.insertAdjacentHTML("beforeEnd",
"<object id=\"printWB\" width=0 height=0 \
classid=\"clsid:8856F961-340A-11D0-A96B-00C04FD705A2\">");
printFireEvent(frame, eventScope, "onbeforeprint");
frame.focus();
window.printHelper = printHelper;
setTimeout("window.printHelper()", 0);
}
// helpers
function printIsNativeSupport() {
var agent = window.navigator.userAgent;
var i = agent.indexOf("MSIE ")+5;
return parseInt(agent.substr(i)) >= 5 && agent.indexOf("5.0b1") < 0;
}
function printFireEvent(frame, obj, name) {
var handler = obj[name];
switch ( typeof(handler) ) {
case "string": frame.execScript(handler); break;
case "function": handler();
}
}
function printGetEventScope(frame) {
var frameset = frame.document.all.tags("FRAMESET");
if ( frameset.length ) return frameset[0];
return frame.document.body;
}
Iframe中所装载页面的打印效果在所装载页面设置就可以了，如分页等。
5．后台打印
我是通过建一个隐藏Iframe实现的，当然仍然会有页面装载的过程。
下面的函数创建Iframe装载页面并打印。如 printHidden(url) //url为页面地址
function printHidden(url) {
document.body.insertAdjacentHTML("beforeEnd",
"<iframe name=printHiddenFrame width=0 height=0></iframe>");
var doc = printHiddenFrame.document;
doc.open();
doc.write("<body onload=\"parent.onprintHiddenFrame()\">");
doc.write("<iframe name=printMe width=0 height=0 src=\"" +
url + "\"></iframe>");
doc.write("</body>");
doc.close();
}
function onprintHiddenFrame() {
function onfinish() {
printHiddenFrame.outerHTML = "";
if ( window.onprintcomplete ) window.onprintcomplete();
}
printFrame(printHiddenFrame.printMe, onfinish);
}
它用到了printFrame，所以别忘了引用前面的函数。
总之，WebBroswer已经为我们提供了解决方案，我们只要结合需求把它应用好就行了