随心所欲打印form表单

在打印表单的时候，可能有些控件不想打印，有些控件想打印，所以就需要进行设置。在这里使用CSS的一个样式Noprint来控制

demo：

1、首先引入一个WebBrowser在需要打印的页面，可以直接添加：

复制代码代码如下:

</object>

2、页面设置和打印预览

document.all.WebBrowser.ExecWB(6,6)直接打印

document.all.WebBrowser.ExecWB(8,1)页面设置

document.all.WebBrowser.ExecWB(7,1)打印预览

3、隐藏不打印的页面元素和分页

CSS有个Media属性，可以分开设置打印和显示的格式。

如<style media="print" type="text/css"> …</style>中间的格式将只在打印时起作用，不会影响显示界面。

所以可以设定

.Noprint{display:none;}

.PageNext{page-break-after: always;}

</style>

然后给不想打印的页面元素添加：class="Noprint"，那就不会出现在打印和打印预览中了。

想分页的地方添加：<div class="PageNext"></div>就可以了。

代码：

<html>

    <head>

        <title>报表</title>

        <object id="WebBrowser"
            classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height="0"
            width="0">

        </object>

        <style media="print" type="text/css">
.Noprint {
    display: none;
}

.PageNext {
    page-break-after: always;
}
</style>

    </head>

    <body>

        <div class="Noprint">

            <input type="button" value="print"
                onclick="document.all.WebBrowser.ExecWB(6,6)">

            <input type="button" value="printset"
                onclick="document.all.WebBrowser.ExecWB(8,1)">

            <input type="button" value="view"
                onclick="document.all.WebBrowser.ExecWB(7,1)">

            <input type="button" value="frame" onclick="printHidden(FrameId)">

        </div>

        <div class="PageNext">

            第一张

        </div>

        <div class="PageNext">

            第二张

        </div>

         可以打印
        
        <div class="Noprint">
        不需要打印
        </div>

    </body>

</html>

参考文档：http://hi.baidu.com/%C7%A7%C4%EA%D2%BB%D2%B9001/blog/item/b19e9c3c96e6bed47d1e71c5.html

posted @ 2012-03-29 17:08 eggee Views(967) Comments(0) 收藏举报

刷新页面返回顶部

eggee

随心所欲打印form表单

公告