最近要做一个网页打印程序,为了不使页面发生跳转,就想到用window.showModelessDialog()来实现打印功能。但是问题来了,showModelessDialog打开的新窗口里面不让打印,提示脚本错误。我用的打印控件是WebBrowser,包括打印预览,设置和打印都不行。后来在网上搜索也没有好的解决方案。今天苦思冥想终于成功了,贴出来给大家分享一下。
首先,在点击打印按钮之后,调用showModelessDialog跳转到另一个页面A.html,showModelessDialog可以带上相关的参数。这里还要补充一个知识点,那就是showModelessDialog跳转之后子窗口获取父窗口参数的问题。我们可以在子窗口使用window.dialogArguments来获取参数,它默认是获取url后第一个参数的值,如果要获取多个参数,可以用逗号分隔,然后在子页面用split去解析就是了。
然后,虽然已经通过showModelessDialog打开了一个新窗口A.html,但却打印不了A.html的任何内容。我的做法就是再继续跳转。用window.open(),再打开一个B.html页面,所有的打印功能将在B.html里面完成。记住一点,为了不使用户感觉弹出了两个窗口,在open()之后需要关闭当前窗口,当然直接用window.close()就可以了。如此一来,打印功能就解决了。关键的秘诀就是两次跳转。下面我贴出相关代码:
function print(obj){ var parent = window.parent; var id = obj.id; var webbrower = document.getElementById('WebBrowser'); var url="/recharge_for_agents/JSP/front/charge/chargePrint.jsp?random="+Math.random(); parent.showModelessDialog(url,id,"dialogHeight=300px,dialogWidth=200px,dialogLeft=0,dialogTop=0,status=no,resizable=yes"); }
这是第一步,也就是点完打印按钮之后应该进行的操作。
var id = window.dialogArguments; var url = "/recharge_for_agents/JSP/front/charge/realprint.jsp?id="+id; window.open(url,"弹出窗口","height=300px,top=0,left=0,width=200px,status=no,toolbar=no,menubar=no,location=no,scrollbars=yes,resizable=no"); window.close();
这是第二步,也就是上面提到的A.html。由于该页面本身不能打印任何东西,所以在这里我们有进行了第二次跳转而且跳转之后马上关闭当前窗口,所以你就感觉不到我打开了两个新的窗口。
function printPre(){
document.all.WebBrowser.ExecWB(7,1);
}
function printSet(){
document.all.WebBrowser.ExecWB(8,1);
}
function print(){
document.all.WebBrowser.ExecWB(6,6);
}
<object id="WebBrowser" classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 width=0></object>
这是真正的打印页面,使用的是WebBrowser控件。至此打印就OK了!