做過(guò)很多的Web項目,大多數在打印頁(yè)面內容的時(shí)候,采用的都是通過(guò)Javascript調用系統內置的打印方法進(jìn)行打印,也就是調用 PrintControl.ExecWB(?,?)實(shí)現直接打印和打印預覽功能。
打印的效果及控制性雖然不是很好,但是也能勉強使用,應付一般的打印還是 可以的了。
代碼如下所示:
代碼
代碼如下:
//調用PrintControl.ExecWB(?,?)實(shí)現直接打印和打印預覽功能。(直接用系統提供的print()方法打印無(wú)法隱藏某些區域)
//preview:是否顯示預覽。null/false:不顯示,true:顯示
function printPage(preview)
{
try
{
var content=window.document.body.innerHTML;
var oricontent=content;
while(content.indexOf("{$printhide}")>=0) content=content.replace("{$printhide}","style='display:none'");
if(content.indexOf("ID="PrintControl"")<0) content=content+"<OBJECT ID="PrintControl" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>";
window.document.body.innerHTML=content;
//PrintControl.ExecWB(7,1)打印預覽,(1,1)打開(kāi),(4,1)另存為,(17,1)全選,(10,1)屬性,(6,1)打印,(6,6)直接打印,(8,1)頁(yè)面設置
if(preview==null||preview==false) PrintControl.ExecWB(6,1);
else PrintControl.ExecWB(7,1); //OLECMDID_PRINT=7; OLECMDEXECOPT_DONTPROMPTUSER=6/OLECMDEXECOPT_PROMPTUSER=1
window.document.body.innerHTML=oricontent;
}
catch(ex){ alert("執行Javascript腳本出錯。"); }
}
function printConten(preview, html)
{
try
{
var content=html;
var oricontent=window.document.body.innerHTML;
while(content.indexOf("{$printhide}")>=0) content=content.replace("{$printhide}","style='display:none'");
if(content.indexOf("ID="PrintControl"")<0) content=content+"<OBJECT ID="PrintControl" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>";
window.document.body.innerHTML=content;
//PrintControl.ExecWB(7,1)打印預覽,(1,1)打開(kāi),(4,1)另存為,(17,1)全選,(10,1)屬性,(6,1)打印,(6,6)直接打印,(8,1)頁(yè)面設置
if(preview==null||preview==false) PrintControl.ExecWB(6,1);
else PrintControl.ExecWB(7,1); //OLECMDID_PRINT=7; OLECMDEXECOPT_DONTPROMPTUSER=6/OLECMDEXECOPT_PROMPTUSER=1
window.document.body.innerHTML=oricontent;
}
catch(ex){ alert("執行Javascript腳本出錯。"); }
}
上面兩個(gè)函數放在一個(gè)Js文件中,在頁(yè)面內容中通過(guò)應用該腳本文件并調用進(jìn)一步封裝的函數即可打印指定部分的內容:
代碼如下:
<script language="javascript">
function Print(preview) {
var text = document.getElementById("content").innerHTML;
printConten(preview, text);
}
打印的效果大致如下圖所示,如果打印的頁(yè)面在框架頁(yè)面中,那么需要選定“僅打印選定框架”的選項。
采用此種方法,不需要安裝任何控件,具有很好的兼容優(yōu)勢,不過(guò)出來(lái)的報表內容,好像控制起來(lái)會(huì )比較麻煩一些,特別對于一些報表方面的打印,需要輸出復雜的內容是,也有一定的缺陷,但總體來(lái)說(shuō),也是一個(gè)較好的選擇。
后來(lái)在需要做一些證件套打方面的工作,這個(gè)控件就做不到了,因此需要一種方法或者控件,能夠較好處理套打方面的事情。
無(wú)意間,發(fā)現一個(gè)比較好的打印控件,支持各種格式的打印,還有我關(guān)心的證件套打功能,功能強大,使用也很簡(jiǎn)單的,非常值得推薦。
控件的相關(guān)地址:
控件下載 http://www.jb51.net/codes/23956.html
控件博客介紹:http://blog.sina.com.cn/s/articlelist_1340389911_0_1.html
應用這個(gè)控件,普通報表的打印效果如下所示:
上面兩個(gè)報表的打印其實(shí)都差不多,都是打印部分的HTML內容,不過(guò)后者看起來(lái)要好一點(diǎn),而且提供很完善的報表功能設置。
代碼大致如下所示。
代碼
代碼如下:
<script language="javascript">
function Print(preview) {
var text = document.getElementById("content").innerHTML;
printConten(preview, text);
}
</script>
<script language="javascript" src="http://www.cnblogs.com/Scripts/CheckActivX.js"></script>
<object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0> </object>
<script language="javascript">
var LODOP = document.getElementById("LODOP"); //這行語(yǔ)句是為了符合DTD規范
CheckLodop();
</script>
<script language="javascript" type="text/javascript">
function Preview() {//打印預覽
CreateLicenseData();
LODOP.SET_SHOW_MODE("PREVIEW_IN_BROWSE", 1);
LODOP.PREVIEW();
};
function Setup() {//打印維護 給用戶(hù)調整位置
CreateLicenseData();
LODOP.PRINT_SETUP();
};
function Design() {//打印設計 開(kāi)發(fā)人員設置內容和位置
CreateLicenseData();
LODOP.PRINT_DESIGN();
};
function CreateLicenseData() {
LODOP.PRINT_INIT("查詢(xún)報表");
LODOP.ADD_PRINT_HTM(20, 40, 610, 900, document.all("content").innerHTML);
LODOP.PREVIEW();
}
</script>
很多時(shí)候,我們也沒(méi)的內容,都是通過(guò)CSS來(lái)控制美觀(guān)的,所以有時(shí)候,我們打印部分HTML,沒(méi)有這些樣式的話(huà),那么出來(lái)的Table格式和字體,可能都會(huì )發(fā)生變化,不太好看。那么就需要進(jìn)行HTML的樣式設置。

如果給打印內容設置了樣式,那么出來(lái)的界面效果就好很多了。
設置樣式的代碼如下所示。
代碼
代碼如下:
<script language="javascript" type="text/javascript">
function Preview() {//打印預覽
CreateLicenseData();
LODOP.SET_SHOW_MODE("PREVIEW_IN_BROWSE", 1);
LODOP.PREVIEW();
};
function CreateLicenseData() {
LODOP.PRINT_INIT("申請處理單");
var strBodyStyle = "<link type='text/css' rel='stylesheet' /><style><!--table { border:1;background-color: #CBCBCC } td {background-color:#FFFFFE;border: 1; } th { background-color:#F1F1F3;padding-left:5px;border:1}--></style>";
var strFormHtml = strBodyStyle + "<body>" + document.getElementById("content").innerHTML + "</body>";
LODOP.ADD_PRINT_HTM(20, 40, 610, 900, strFormHtml);
LODOP.PREVIEW();
}
</script>