使用ScriptX控件进行Web横向打印
一个需求需要采用横向打印，目前采用IE自身的打印功能（WebBrowser.ExecWB控件）很难进行横向设置，默认需要调用document.all.WebBrowser.ExecWB(8,1);打开打印设置对话框进行人工设置，颇为不方便，本次采用ActiveX控件，也即第三方的ScriptX控件进行横向设置。
ScriptX基本功能免费，但高级功能是收费的，下面我就把最近在项目中使用ScriptX的经验总结一下。
1. 首先把ScriptX.cab放在一个目录下面，比如根目录
2. 目前html5 doc需要把object放在head之外
引入如下
...
</head>
<object id="factory" viewastext classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="ScriptX.cab#Version=5,60,0,360"></object>
<body>
...
3. 设置打印属性
function InitPrinterSetting() {
factory.printing.header = "";//页眉
factory.printing.footer = "";//页脚
factory.printing.leftMargin = 1.0;//左边距
factory.printing.topMargin = 1.3;//上边距
factory.printing.rightMargin = 1.0;//右边距
factory.printing.bottomMargin = 1.3;//下边距
factory.printing.portrait = false;//打印方向，true:纵向.false:横向
}
4. 如下style用于去除打印
<style media="print">
.Noprint{display:none;} <!--用本样式在打印时隐藏非打印项目-->
.PageNext{page-break-after: always;} <!--控制分页-->
</style>
完整代码如下（附件可下载）：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PrintPreviewAndUnion.aspx.cs" Inherits="TMIS.WebApp.CustomerMA.PrintPreviewAndUnion" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../Scripts/lib/jquery-1.4.2.min.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../Scripts/lib/jquery-ui-1.8.5.custom.min.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../Scripts/lib/jquery.formatCurrency-1.4.0.min.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../Scripts/lib/jquery.utils.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../Scripts/lib/jquery.numeric.pack.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../Scripts/lib/jquery.timepickr.min.js"></script>
<title>WebPrint</title>
<script type="text/javascript">
function PrintPage() {
factory.DoPrint(false);//设置为false，直接打印
}
function InitPrinterSetting() {
factory.printing.header = "";//页眉
factory.printing.footer = "";//页脚
factory.printing.leftMargin = 1.0;//左边距
factory.printing.topMargin = 1.3;//上边距
factory.printing.rightMargin = 1.0;//右边距
factory.printing.bottomMargin = 1.3;//下边距
factory.printing.portrait = false;//打印方向，true:纵向.false:横向
}
$(document).ready(function () {
InitPrinterSetting();
})
</script>
<style media="print">
.Noprint{display:none;} <!--用本样式在打印时隐藏非打印项目-->
.PageNext{page-break-after: always;} <!--控制分页-->
</style>
</head>
<object id="factory" viewastext classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="ScriptX.cab#Version=5,60,0,360"></object>
<OBJECT id="WebBrowser" height="0" width="0" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" VIEWASTEXT></OBJECT>
<body>
<form id="form1" runat="server">
<div>
<center>
<div class="div_content" >
<div style='text-align:center; padding-top:15px; padding-bottom:15px;' class='Noprint' >
<input id="btnPrint" type="button" value="直接打印" />
<input id='btnYes' value='打印预览' type='button' onclick='document.all.WebBrowser.ExecWB(7,1);' style='width: 90px;height:31px;' />
</div>
<div id="print_div_receipt" >
<div >
<div >
<div ></div>
<span ><b>打印内容</b></span>
</div>
</div>
</div>
</div>
</center>
</div>
</form>
</body>
</html>
共同学习，写下你的评论
评论加载中...
作者其他优质文章
