介绍一种Web上打印技术

一、介绍ScriptX控件

对于B/S架构的项目中，Web打印最是让程序员头痛的技术，在这次项目中运用了第三方控件ScriptX解决了此技术包括各种汇总表，详细清单等等，但最大弊端就是打印的格式是死的，你要打印出怎样的格式必须自己来做，还有就是打印分页，它是按你设置的纸张大小来分的，所以必须人为控制，ScriptX控件所需文件ScriptX.cab。（ScriptX下载地址http://www.meadroid.com/scriptx/freedep.asp ）

打印功能使用：

⑴ 用户在客户端单击“打印”按钮，第一次使用打印会弹出如下对话框

⑵ 单击“是”按钮，此时会把控件ScriptX下载到本机

⑶ 在打印窗口中有大标题、打印条件、打印列表，单击“打印”按钮进入打印浏览界面。

⑷ 单击“Print”按钮，听打印机声音响起。

二、 一个简单的ScriptX控件使用实例

1．界面文件 WebExample.aspx （其中kg.css是界面样式在这里就不介绍了）

<%@ Page language="c#" Codebehind="WebExample.aspx.cs" AutoEventWireup="false" Inherits="WebPrint.WebExample" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<HTML>

<HEAD>

<title>一个简单的ScriptX打印</title>

</HEAD>

<tr>

</td>

</tr>

<tr>

<asp:Label id="Label1" runat="server" Width="232px" Height="32px" Font-Size="Large">欢迎使用ScriptX打印</asp:Label>

</div>

</td>

</tr>

<tr>

<asp:Image id="Image1" runat="server" ImageUrl="win2000.gif"></asp:Image>

</div>

</td>

</tr>

<tr>

<input id="btnPrint" style="WIDTH: 32px; HEIGHT: 19px" onclick="printResult();" type="button"

size="1" value="打印" name="btnPrint">

</td>

</tr>

</TABLE>

</form>

function printResult()

{

//针对不同模块，设置打印参数

var title = 'ScriptX打印';//报表名称

var orien = 'true';//打印页面方向，true:纵向打印/false横向打印

//参数设置结束

var strURL;

title = escape(title);

//condition = escape(condition);

strURL = 'printContainer2.aspx?title='+title+'&orien='+orien;

window.open(strURL,'printResult','height=600, width=800, top=0, left=50,toolbar=no , menubar=no, scrollbars=yes, resizable=no, location=no, status=no');

}

</script>

</body>

</HTML>

说明：

⑴ <div id="divTableResult" name="divTableResult">和<div id="divChartResult" name="divChartResult"> 是在printContainer2.aspx文件中定义的传值标签，因此必须要有。

⑵ printResult（）方法用来声明传值内容，具体在方法中已说明

2．打印界面 printContainer2.aspx （其中print.css是打印样式就不介绍了）

<%@ Page language="c#" Codebehind="printContainer2.aspx.cs" AutoEventWireup="false" Inherits="WebPrint.printContainer2" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

string title = "查询打印";

‘用于title获取标题

if(Request.QueryString["title"].ToString().Trim()!=""){

title = Request.QueryString["title"].ToString().Trim();

}

‘用于orientation获取打印页面方向，true:纵向打印/false横向打印

string orientation = "true";

if(Request.QueryString["orien"].ToString().Trim()!=""){

orientation = Request.QueryString["orien"].ToString().Trim();

}

<html>

<head>

<title>ScriptX 打印</title>

if(event.srcElement.tagName=='A'){

//alert('a click!');

event.cancelBubble = true;

}

</script>

a:link {text-decoration:none}

a:visited {text-decoration:none}

a:active {text-decoration:none}

a:hover {text-decoration:none}

A { COLOR: #000000;TEXT-DECORATION: none; FONT-SIZE: 8pt;FONT-FAMILY: "";}

</style>

</head>

classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"

codebase="ScriptX.cab#Version=6,1,431,2">

</object>

//用于设置打印参数

function printBase() {

factory.printing.footer = "&b ScriptX 打印 &b" //页眉

factory.printing.footer = "" //页脚

factory.printing.portrait = <%=orientation%> //true为纵向打印，flase为横向打印

factory.printing.leftMargin = 1.5 //左页边距

factory.printing.topMargin = 0.5 //上页边距

factory.printing.rightMargin = 0.5 //右页边距

factory.printing.bottomMargin = 1.0 //下页边距

}

</SCRIPT>

<td >

<tr>

</tr>

<tr>

</div>

</td>

</tr>

</table>

</td>

</tr>

</table>

</td></tr>

</td></tr>

</table>

</body>

//使界面最大化

maxWin();

var needcon='';

document.all.divTitle.innerText = unescape('<%=title%>');

//用于把父窗体的divTableResult和divChartResult标签的值分别转入divTableContainer 和divChartContainer标签中

var tableContent = window.opener.document.all.divTableResult.innerHTML;

tableContent = replaceAll(tableContent,"<A ","<span ");

tableContent = replaceAll(tableContent,"</A> ","</span> ");

tableContent = replaceAll(tableContent,"<a ","<span ");

tableContent = replaceAll(tableContent,"</a> ","</span> ");

tableContent = replaceAll(tableContent,"<input ","<font ");

tableContent = replaceAll(tableContent,"<INPUT ","<font ");

document.all.divTableContainer.innerHTML = tableContent;

document.all.divChartContainer.innerHTML = window.opener.document.all.divChartResult.innerHTML;

//用于调用设置打印参数的方法和显示预览界面

function printReport(){

printBase();

//window.print();

factory.printing.Preview();

}

function replaceAll( str, from, to ) {

var idx = str.indexOf( from );

while ( idx > -1 ) {

str = str.replace( from, to );

idx = str.indexOf( from );

}

return str;

}

function maxWin()

{

var aw = screen.availWidth;

var ah = screen.availHeight;

window.moveTo(0, 0);

window.resizeTo(aw, ah);

}

</script>

</html>

三、参考文件
源代码

posted on 2005-06-17 13:36 surprise 阅读(18193) 评论(60) 编辑收藏举报

刷新页面返回顶部

surprise

介绍一种Web上打印技术

导航

公告