HTML中利用WebBrowser控件进行打印页面的控制

我们知道，web中打印并不容易。

但是利用IE浏览器自带的 Web Browser控件，我们可以轻松地做到控制打印页面设置，包括横向，纵向排列，打印预览等。

调用该控件很简单，只需要在html代码中加入如下语句即可：

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

 

下面我们给出具体代码：

<html>
<head>
    <title>Use WebBrowser For Print</title>
    <style type="text/css">
            .printArea p {
                margin: 0 0;
                padding: 0px 0px 0px 0px;
            }
            .printArea pre {
                margin: 0 0;
                padding: 0px 0px 0px 0px;
            }
            
            .printButton {
                border-left-color: #3300ff; 
                border-bottom-color: #3300ff; 
                border-top-style: inset; 
                border-top-color: #3300ff; 
                border-right-style: inset; 
                border-left-style: inset; 
                border-right-color: #3300ff; 
                border-bottom-style: inset
            }
        </style>
</head>
<body style="text-align: center">
    
<form id="form1">
<object id="WebBrowser" height="0" width="0" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">
</object> 

<div class="printArea">
             
<table>
  <tr>
      <td style="font-size: 10pt; width: 500px; text-indent: 8pt; text-align: center; height: 400px;">
        <pre>
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 这是要打印的内容! 
        </pre>
        <p>这也是要打印的内容!</p>
        <p>这也是要打印的内容!</p>
        <p>这也是要打印的内容!</p>
        <p>这也是要打印的内容!</p>
       </td>
  </tr>
  <tr>
      <td style="text-align: center;">
        
        <input id="btnPrint" class="printButton" onclick="document.all.WebBrowser.ExecWB(6,1);" type="button" value="Print"> 
        <input id="btnPrintSetup" class="printButton" onclick="document.all.WebBrowser.ExecWB(8,1);" type="button" value="Page Setup" >
        <input id="btnPrintPreview" class="printButton" onclick="document.all.WebBrowser.ExecWB(7,1);" type="button" value="Print Preview">
        
      </td>
  </tr>
</table>

</div>

</form>

</body>
</html>

 

posted @ 2009-07-14 14:47  Master HaKu  阅读(4404)  评论(1)  编辑  收藏  举报