使用ScriptX控件实现web打印

阅读更多

使用ScriptX控件实现web打印的功能,网上一抓一大把,我这里就不写怎么用了,就直接说可能碰到的一些问题和解决办法吧。

 

1、使用ScriptX控件进行打印,通常都是在HTML中嵌入:

使用这种方法第一次打印不会有问题,但是第二次在不刷新的情况下再次打印会报错:浏览器只允许运行一个ScriptX控件 。

 

因此可以考虑:

a、页面初始化时HTML中不嵌入Object标签,也就是不添加打印功能;

b、打击“打印”或“打印预览”时再使用JS添加Object标签,然后进行打印或打印预览;

c、打印完成了再使用JS移除掉Object,保证每次都只有一个ScriptX控件在运行。

注意点:

打印过程我们没法控制,因此我们也没法(或者说并不是每次都能精准地)精准地移除Object控件,若不能成功移除第二次打印时就可能还是会出现上面说的问题。

这时可以将smsx.cab控件安装一下,然后再修改注册表。如何操作各位百度吧!

 

2、在IE8中点击了“打印”或“打印预览”之后没有任何效果:

要想使用ScriptX控件进行打印,还得设置一下浏览器的ActiveX控件,主要是两个地方:

a、对未标记为可安全执行脚本的ActiveX控件初始化并执行脚本

b、下载未签名的ActiveX控件

打开IE浏览器,找到“工具”-->“Internet选项”-->“安全”-->“自定义级别”,再找到以上说的两项,设置成“启用”或“提示”,然后再点击“打印”或“打印预览”,此时就会弹出提示问“是否安装”或“是否允许运行”,选择允许,待安装完成再打印就可以了。

注意点:

默认情况下,安全选项卡的“区域设置”中默认选定的是“Internet”,要是这个设置了以上两项还是没有反应,就将“本地Intranet”也设置一下。一版设置到“Internet”和“本地Intranet”再点击时应该就有反应了。

 

3、在打印的时候插入分页符:

在打印的时候,有时候需要强制换页,譬如有一个单子,一式两份,在网页上是展示在一个HTML中的,打印出来自然就是作为一张纸打印的,但是前面说了要一式两份,因此第二份要打印到第二张纸上。这个时候就需要使用page-break-before:always;什么的来进行分页了。

这个page-break主要有三个值:

page-break-before:设置在表格元素之后始终进行分页的分页行为。它可以取值auto/always/avoid/left/right/inherit。(参考:http://www.w3school.com.cn/cssref/pr_print_page-break-before.asp)

page-break-after:设置在表格元素之后始终进行分页的分页行为。它可以取值auto/always/avoid/left/right/inherit。(参考:http://www.w3school.com.cn/cssref/pr_print_page-break-after.asp)

page-break-inside:设置在表格元素内部避免进行分页的分页行为,它可以取值avoid/auto/inherit。(参考:http://www.w3school.com.cn/cssref/pr_print_page-break-inside.asp)

各个值的含义:

描述
auto 如果必要则在元素前/后插入分页符
always 在元素前/后插入分页符。
avoid 避免在元素前/后插入分页符。
left 在元素之前/后足够的分页符,一直到一张空白的左页为止。
right 在元素之前/后足够的分页符,一直到一张空白的右页为止。
inherit 规定应该从父元素继承 page-break-after 属性的设置。

注意点:

a、所有浏览器都支持 page-break-before、page-break-after属性,只有 Opera 浏览器支持 page-break-inside 属性。

b、任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "left"、"right" 以及 "inherit"。

c、Firefox、Chrome 以及 Safari 不支持属性值 "avoid"、"left" 以及 "right"。

d、这个分页符若是添加在DIV上则没有任何效果,譬如:这样子去打印不会分页。其他的除了table中的标签之外是否有效没有测试过。

table系列的标签对于这个分页符好像支持的特别好,无论是设置在tr上还是table上,都能正常断页。

我这里就是直接在两个DIV之间了table用来实现一式两份的打印功能。

 

 

4、打印的时候没有背景色:

这个背景色是需要设置的,默认情况下web的打印时没有背景色的。设置主要有两个地方:

a、打开IE浏览器,找到“工具”-->“Internet选项”-->“高级”,找到“打印背景颜色和图像”,然后勾选,如图:
使用ScriptX控件实现web打印_第1张图片

b、设置了上面的功能之后,预览情况下还是没有背景色,这个时候还需要设置一下“页面设置”。在“打印预览”页面有个“页面设置”,打开它,找到“打印背景颜色和图像”,“确定”之后可以看到预览区有背景色的都显示出来了。
使用ScriptX控件实现web打印_第2张图片

至此,打印背景色看似没有问题了,实际上它还有一个问题:我总不能每次都设置一遍允许打印背景颜色吧。对的,不可能每次都设置,那能不能找个一劳永逸的在打印用到的print_utils.js进行设置呢?

可以设置,在printBase方法中添加:factory.printing.printBackground  = true;允许打印背景色。设置时没错,但是打印的时候会报错:
使用ScriptX控件实现web打印_第3张图片
为什么会这样子呢?因为printBackground的设置时高级应用,是要收费的。而当前用的基本上都是免费的,它只能修改基本设置。

以下是ScriptX控件常用的参数设置:

// -------------------基本功能,可免费使用-----------------------
factory.printing.header = "";//页眉
factory.printing.footer = "";//页脚
factory.printing.SetMarginMeasure(1);//页边距单位,1为毫米,2为英寸

//边距设置,需要注意大部分打印机都不能进行零边距打印,即有一个边距的最小值,一般都是6毫米以上
//设置边距的时候时候如果设置为零,就会自动调整为它的最小边距
factory.printing.leftMargin = 7;//左边距
factory.printing.topMargin = 7;//上边距
factory.printing.rightMargin = 7;//右边距
factory.printing.bottomMargin = 7;//下边距
factory.printing.portrait = true;//是否纵向打印,横向打印为false

//--------------------高级功能---------------------------------------------
factory.printing.printer = "EPSON LQ-1600KIII";//指定使用的打印机
//factory.printing.printer = "\\\\cosa-data\\HPLaserJ";//如为网络打印机,则需要进行字符转义
factory.printing.paperSize = "A4";//指定使用的纸张
factory.printing.paperSource = "Manual feed";//进纸方式,这里是手动进纸
factory.printing.copies = 1;//打印份数
factory.printing.printBackground = false;//是否打印背景图片
factory.printing.SetPageRange(false, 1, 3); //打印1至3页

//---------------------常用函数--------------------------------
factory.printing.Print(false);//无确认打印,true时打印前需进行确认
//factory.printing.Print(false, pageFrame); pageFrame为Iframe或Frame框架名称,只打印框架内容
factory.printing.PrintSetup();//打印设置
factory.printing.Preview();//打印预览
factory.printing.WaitForSpoolingComplete();//等待上一个打印任务完全送入打印池,在连续无确认打印时非常有用
factory.printing.EnumPrinters(index);//枚举已安装的所有打印机,主要用于生成打印机选择功能

 

5、最后附上页面调用打印功能的JS:

/**
 * 打击“打印预览”按钮时触发该事件
 * */
function printpage(){
	$("body").append('');
	var printdiv = document.getElementById("page");
	printdiv.style.overflow="";
	previews();
	printdiv.style.overflow="auto";
	$("#factory").remove();
}

/**
 * 打击“打印”按钮时触发该事件
 * */
function printTures() {
	$("body").append('');
	var printdiv = document.getElementById("page");
	printdiv.style.overflow="";
	printBase();
	document.getElementById("print").style.display = "none";// 隐藏按钮
	factory.printing.Print(false);
	document.getElementById("print").style.display = "block";// 显示按钮
	$("#factory").remove();
}
/**
 * 调用ScriptX控件进行打印预览
 * */
function previews(){
	printBase();
	document.getElementById("print").style.display = "none";// 隐藏按钮
	factory.printing.Preview();
	document.getElementById("print").style.display = "block";// 显示按钮
	$("#factory").remove();
}

附:附件中有打印用到的JS工具包,其中print_utils为横向打印用的JS,print_utils2为竖向打印用的JS。其实两者内容都是一样的,就是printBase方法中的factory.printing.portrait设置不一样,若为true就是纵向打印,false就是横向打印 。

 

希望对大家有所帮助!

  • 使用ScriptX控件实现web打印_第4张图片
  • 大小: 42.9 KB
  • 使用ScriptX控件实现web打印_第5张图片
  • 大小: 30 KB
  • 使用ScriptX控件实现web打印_第6张图片
  • 大小: 30.2 KB
  • 打印功能所用JS.zip (1.9 KB)
  • 下载次数: 7
  • 查看图片附件

你可能感兴趣的:(ScriptX控件,web打印,smsx.cab)