[JS] 用 Java Script 列印網頁中指定的圖層

2010-10-07

12784
0
JavaScript

摘要:[JS] 用 Java Script 列印網頁中指定的圖層

因為不希望把網頁中所有的東西都列印，尤其是有頁框 or MasterPage的時候，用以下語法可指定僅列印網頁中某一圖層內容(<DIV>)
分為三個部份：

一、網頁 print.aspx，加入一個HTML產生的button，並在onclick指定欲執行的JS片段

<input id="btnPrint" type="button" value="列印成績" onclick="printScreen(printlist)"/>

接著新增一個圖層標籤，在此命名為 printlist

<div id="printlist">
            <table style="width: 750px">
            <tr>
                <td>
                    欄位一
                </td>
                <td style="width: 150px">
                    欄位二</td>
            </tr>
            <tr>
                <td colspan="2">
                    可以把GirdView放在這裡來列印
                </td>
            </tr>
            <tr>
                <td colspan="2">
                     </td>
            </tr>
            <tr>
                <td colspan="2">
                    表尾</td>
            </tr>
            </table>
    
</div>

二、網頁程式 print.aspx.cs，在Page_Load時載入JS檔

protected void Page_Load(object sender, EventArgs e)
{
  Page.ClientScript.RegisterClientScriptInclude("myPrint", "Print.js");
}

三、JS檔內容

function printScreen(printlist)
{
var value = printlist.innerHTML;
var printPage = window.open("","printPage","");
printPage.document.open();
printPage.document.write("<HTML><head></head><BODY onload='window.print();window.close()'>");
printPage.document.write("<PRE>");
printPage.document.write(value);
printPage.document.write("</PRE>");
printPage.document.close("</BODY></HTML>");
}

參考資料：抱歉，我真的想不起來了，若有侵權請跟我說一聲，小的願意將文章刪除或補上參考來源 <(_ _)>

回首頁