Javascript Print(*)

1. 实现打印功能
1) ExecWB()
通过脚本程序来调用IE菜单下面的打印命令。实现的代码如下:
<script language="javascript">

  function printsetup(){ // 打印页面设置

  wb.execwb(8,1);

  }

  function printpreview(){ // 打印页面预览

  wb.execwb(7,1);

  }

  function printit() { //打印

   if (confirm('确定打印吗?')) {

   wb.execwb(6,1)

   }

  }

</script>

<OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=wb width=0></OBJECT>

<input type=button name=button_print value="打印" onclick="javascript:printit()">

<input type=button name=button_setup value="页面设置" onclick="javascript:printsetup();">

<input type=button name=button_show value="打印预览" onclick="javascript:printpreview();">

<input type=button name=button_fh value="关闭" onclick="javascript:window.close();">



这个Object 其实就?IEWebBrowser 设定 Width 和 Height 以后,我们在界面上就看不到控件的形状了,然后,我们就可以使用 这个object 实现我们选纸和预览的功能了。

关于这个组件还有其他的用法,列举如下:

l wb.ExecWB(1,1) 打开

l wb.ExecWB(2,1) 关闭现在所有的IE窗口,并打开一个新窗口

l wb.ExecWB(4,1) 保存网页

l wb.ExecWB(6,1) 打印

l wb.ExecWB(7,1) 打印预览

l wb.ExecWB(8,1) 打印页面设置

l wb.ExecWB(10,1) 查看页面属性

l wb.ExecWB(15,1) 好像是撤销,有待确认

l wb.ExecWB(17,1) 全选

l wb.ExecWB(22,1) 刷新

l wb.ExecWB(45,1) 关闭窗体无提示

2) document.execCommand()
<a href="#" onclick=document.execCommand("print")>打印</a>

3) window.print()
使用:javascript:window.Print()

Prints the contents of the window.

方法源
Window

实现版本
Navigator 4.0



语法:print()

参数:无

2. 实现套打功能:使用css
要实现去掉触发打印命令的本身按钮,只需要添加以下代码:

<STYLE MEDIA="print">

#btn1 {display: none}

#btn2 {display: none}

#btn3 {display: none}

#btn4 {display: none}

</STYLE>

然后在以上四个按钮中加上id,分别为:btn1、btn2、btn3、btn4。

<input type=button name=button_print value="打印" onclick="javascript:print()" id="btn1">

<input type=button name=button_setup value="页面设置" onclick="javascript:printsetup();" id="btn2">

<input type=button name=button_show value="打印预览" onclick="javascript:printpreview();" id="btn3">

<input type=button name=button_fh value="关闭" onclick="javascript:window.close();" id="btn4">


3. 去掉页眉页脚:使用JavaScript
<script language="JavaScript">

var hkey_root,hkey_path,hkey_key

hkey_root="HKEY_CURRENT_USER"

hkey_path=\\Software\\Microsoft\\Internet Explorer\\PageSetup\\

//设置网页打印的页眉页脚为空

function pagesetup_null(){

try{

var RegWsh = new ActiveXObject("WScript.Shell")

hkey_key="header"

RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"")

hkey_key="footer"

RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"")

}catch(e){}

}

//设置网页打印的页眉页脚为默认值

function pagesetup_default(){

try{

var RegWsh = new ActiveXObject("WScript.Shell")

hkey_key="header"

RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"&w&b页码,&p/&P")

hkey_key="footer"

RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"&u&b&d")

}catch(e){}

}

<Script>

4. 分页问题:使用css
<style type="text/css">

div.pageEnd {page-break-before:always}

</style>

然后在需要强制分页的地方用:

<div class="pageEnd">

待定页的内容

</div>

如果使用的是page-break-before,那么div的内容在后一页,

如果使用的是page-break-after,那么div的内容在前一页

page-break-after:检索或设置对象后出现的页分割符

语法: page-break-after : auto | always | avoid | left | right | null

参数:

l auto :  假如需要在对象之后插入页分割符

l always :  始终在对象之后插入页分割符

l avoid :  避免在对象后面插入页分割符

l left :  在对象后面插入页分割符直到它到达一个空白的左页边

l right :  在对象后面插入页分割符直到它到达一个空白的右页边

l null :  空值。IE5用来取消页分割符设置

示例: p { page-break-after: always;}

page-break-before:检索或设置对象前出现的页分割符

语法: page-break-before : auto | always | avoid | left | right | null

参数:

l auto :  假如需要在对象之前插入页分割符

l always :  始终在对象之前插入页分割符

l avoid :  避免在对象前面插入页分割符

l left :  在对象前面插入页分割符直到它到达一个空白的左页边

l right :  在对象前面插入页分割符直到它到达一个空白的右页边

l null :  空值。IE5用来取消页分割符设置

示例: p { page-break-after: always;}

5. 不弹出打印对话框:设置ExecWB的参数
<object ID="WebBrowser1" WIDTH="0" HEIGHT="0" CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">

</object>

<script language="javascript">

function print(){

WebBrowser1.ExecWB(6,1);

}

</script>

然后在页面里加一个按扭:

<input type=button name=print value="print" onclick="print()">

这样做,在按下按扭时会弹出窗口提示,如果不要提示,将第二个参数1改为6。

6、打印分页问题(css中的pagebreak可以控制)

pagebreak:在打印的时候强迫在样式控制的对象前后换页。

before:设置对象前出现的页分割符。设置为always时,始终在对象之前插入页分割符。相对应的css属性是”page-break-before”。

after:设置对象后出现的页分割符。设置为always时,始终在对象之后插入页分割符。相对应的css属性是”>。

用page-break-after
page-break-after版本:css2 兼容性:ie4+ 继承性:无
语法:
page-break-after : auto | always | avoid | left | right | null
取值:
auto :   假如需要在对象之后插入页分割符
always :   始终在对象之后插入页分割符
avoid :   未支持。避免在对象后面插入页分割符
left :   未支持。在对象后面插入页分割符直到它到达一个空白的左页边
right :   未支持。在对象后面插入页分割符直到它到达一个空白的右页边
null :   空白字符串。取消页分割符设置

说明:
检索或设置对象后出现的页分割符。
此属性在打印文档时发生作用。此属性不作用于 br 或 hr 对象。
假如在浏览器已显示的对象上此属性和 page-break-before 属性的值之间发生冲突,则导致最大数目分页的值被使用。
页分隔符不允许出现在定位对象内部。
在ie6及之前版本浏览器中, left 和 right 值的作用结果等同于 always 。
此属性对于 currentstyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 pagebreakafter 。
示例:
p { page-break-after: always;}

vue2 使用print.js实现打印功能 打印时发现表格显示不全,需手动调整打印设置,在右边的更多设置-缩放,选择自定义,缩放至合适的大小。传入自定义样式的字符串,作用于被打印的HTML标签上。自定义页面上所有元素的样式,在打印时生效。可以通过给打印区域设置class类名或id值,也可以使用ref获取DOM节点。打印JSON时传入的表头名称,要和JSON中的键值对的键保持一致。局部引入print-js,指定不同的打印类型。记录print.js实现打印功能的过程。打印JSON时,表格的自定义样式。打印JSON时,表头的自定义样式。 阅读详情

相关推荐

vue 使用print.js实现前端打印功能

最近新接了一个需求,想要在前端实现打印功能,最开始试了window.print()这个方法,结果发现我想打印的图片它只能打印图片中的一部分,打印的不完整,如下图 调整了缩放比例之后发现还是不可以,后来又尝试了vue里面的一个插件vue-print-nb,但是当所有的东西都配置好之后,点击打印的时候竟然报错,大概意思是说我的css样式获取不到 然后我试了最后一种方法,亲测好使print.js...

cccdf_jjj的博客 5万+

js实现打印

print()方法用于在浏览器中触发打印操作。这个方法通常用于打印当前页面的内容或者特定的元素。以下是如何使用.print()

abc8002117034的博客 1635

记录一个好用的打印插件 print.js

记录一个好用的打印插件 print.js GitHub上1.5k星星的打印插件值得试试,直接print.js官网传送门 支持pdf,html,img,json格式的打印,想动态打印json数据都是可以的. npm 和cdn 导入项目 npm npm install print-js --save import print from ‘print-js’ cdn https://printjs-4d...

夜凉船影浸疏星的博客 2514

js几种打印方法的几种方法

根据您的具体需求和使用环境,您可以选择适合您的方法来实现打印功能。希望这些信息对您有所帮助。替换为要打印的元素的实际 ID。您可以打印整个页面,也可以指定要打印的特定元素。在上面的示例中,当用户点击"Print"按钮时,将触发打印操作,打印。在您的 HTML 文件中创建一个按钮,用于触发打印操作。库的 JavaScript 文件和 CSS 文件。希望这些详细的步骤能够帮助您实现打印功能。首先,在您的 HTML 文件中引入。正常工作,您需要确保您的网页在加载。希望这个详细的教程能够帮助您使用。

一步一个脚印,踏实努力,向着目标前进 1万+

地球引擎保姆级教程——JavaScript的基础语法介绍(print,括号和函数)

// 你在任何编程语言中做的第一件事。 print('Hello, World!'); // 行注释以两个正斜杠开始。就像这一行。 /* 多行注释以一个正斜杠和一个星号开始。 并以一个星和一个正斜杠结束。*/ // 变量是用来存储对象的,使用关键字var来定义。 var the_answer = 42; // 字符串对象以单引号开始和结束。 var my_variable = 'I am a string'; //字符串对象也可以用双引号开始和结束。 // 但不要混合使用它们。 var my_o.

此星光明博客 756

手把手教你用Verilog实现AT24C64的I2C读写(附完整仿真流程)

本文详细介绍了如何使用Verilog HDL设计AT24C64 EEPROM的I2C控制器,并配合ModelSim完成完整的仿真验证流程。内容涵盖I2C协议解析、Verilog状态机设计、AT24C64读写操作实现,以及仿真波形分析和调试技巧,为FPGA开发者提供了一套完整的EEPROM控制解决方案。

3c4x5z6v7b的博客 843

Print.js javascript库 实现页面打印

npm 安装npm安装时将库导入项目首先,我们需要在页面上包含Print.js库和样式下面主要介绍一下我们要用的打印方法printJS();与相同,这将处理任何一系列样式。例如:['border','padding'],将包括'border-bottom','border-top','border-left','border-right','padding-top'等。你也可以传递['*']来处理所有样式打印pdf时,如果浏览器不兼容(检查浏览器兼容性表),库将在新选项卡中打开pdf。...

sxj的专栏 1万+

Warning-[INFL_DELTA] Too many events zero delay loop

项目场景: 运用VCS工具执行仿真的时候,遇到如下错误提示,但仿真还在继续。 Warning-[INFL_DELTA] Too many events Possible zero delay loop. Too many events in the simulation at time 0 fs. 问题描述: 为什么会有这个问题; 什么导致了这个问题; 原因分析: 1、为什么会有这个问题 由于竞争条件或编码风格不明确,可能会产生零延时回路,导致仿真挂起或仿真时间无限。 2、什么导致了这个问题 举

hh199203的博客 1万+

javascript文档_用javascript print js打印文档的最简单方法

javascript文档A teeny-tiny javascript library that made printing from the web incredibly simple.一个很小的javascript库,使从网络打印变得异常简单。 Photo by Florian Klauer on Unsplash Florian Klauer在Unsplash上拍摄的照片Print.js w...

weixin_26748899的博客 2586

Hyper-V集群部署指南

工欲善其事,必先利其器。搭建一个方便管理的服务集群,是分布式学习很重要的环境。 目前流行的虚拟机产品主要为Vmware 和 win10自带的Hyper-V(win10家庭版无此功能),网上关于Vmware的教程更多,显然它更容易上手,但Hyper-V也算是一个很不错的产品,这里记录一下我的学习过程: 目录 Hyper-V的安装 服务集群的搭建 虚拟机的网络通信 NAT网络的搭建 端口映射 Linux的静态IP 虚拟机的自启动问题 Hyper-V的安装 也不能算说是安装,如果你的win1

Swing 6917

GB28181安防平台未授权访问漏洞:原理、复现与修复指南

未授权访问漏洞是Web安全中常见的访问控制缺陷,其本质在于应用在提供对敏感功能或数据的访问前,未能对请求者的身份和权限进行充分验证。从技术原理上看,这类漏洞常源于拦截器配置错误、安全注解遗漏或自定义校验逻辑缺陷,导致本应受保护的API接口被意外暴露。在工程实践中,此类漏洞危害巨大,攻击者无需登录即可直接访问系统核心接口,可能引发敏感信息泄露、权限提升甚至系统接管。尤其在安防监控、物联网管理平台等场景中,一旦涉及用户管理接口(如`/api/user/**`),风险会急剧放大。本文以GB28181视频监控管理平

weixin_30271335的博客 436

js实现打印 print.js

如果单纯实现打印整个窗口, window.print() 就能实现,但是我们往往要打印一个区域或者说一个div块 由于print打印的是整个窗体,所以我们要把打印区域变成窗体,所以我们需要一个库,来实现这些事 下面介绍 2种 方式使用print.js库实现打印 第一种: (可加上样式) 安装 npm install print-js --save 引入 import print from 'print-js' 使用 –html部分 <div> <p>test prin.

weixin_34403976的博客 4438

对接金蝶云星空调用即时库存信息查询API(附JAVA实现)

这篇文章教你如何对接金蝶API并且使用JAVA调用金蝶云星空的即时库存查询API

实用的博客 2608

Vue3 开发实战分享——打印插件 Print.js 的使用(Vue3 + Nodejs + Print.js 实战)以及 el-table 与 el-pagination 的深入使用(上)

今天久违的更新一下关于 Vue 的文章了,本篇文章是基于 Vue3 + Node.js + ElementPlus 的实战项目分享,实战内容包括有打印插件 Print.js 的使用,以及关于 ElementPlus 中的 el-table 与 el-pagination 的深入使用。本次项目以文章(axios 实战进阶练习——基于 Vue3 + Node.js + ElementPlus 实现的联系人列表管理后台)中的项目为模板进行改动和编写。

黛琳ghz的博客,期待你的关注。 6万+

基于STM32设计的4G远程视频侦查小车(图传+远程控制+EMQX+MQTT)(204)

当前设计了一款基于STM32F103ZET6主控芯片和废旧Android手机改造的4G侦查小车。该设计充分利用已有的智能手机硬件资源,实现摄像头画面的实时采集与上传,以及远程控制功能。这样的设计不仅降低了成本,而且充分利用了废旧手机中高性能的硬件资源,如摄像头、4G通信模块和电池等,实现了资源的有效循环利用。

2527

基于simulink的软开关技术的三相逆变器仿真

三相逆变器中的软开关技术(Soft Switching Techniques)旨在减少开关损耗,提高效率,并降低电磁干扰(EMI)。实现软开关通常涉及使用谐振电路或准谐振电路来确保开关器件在零电压(Zero Voltage Switching, ZVS)或零电流(Zero Current Switching, ZCS)条件下进行切换。下面将详细介绍如何在Simulink中进行基于软开关技术的三相逆变器仿真设计。

xiaoheshang_123的博客 162

浏览器打印功能print.js

print-js 浏览器打印j打印插件 打印预览

香蕉你个芭呐呐的博客 7971

YOLOv11改进策略【模型轻量化】| 替换骨干网络为 2024轻量化网络MoblieNetV4:移动生态系统的通用模型

一、本文介绍 本文记录的是基于MobileNet V4的YOLOv11目标检测轻量化改进方法研究。MobileNet V4通过整合UIB、Mobile MQA以及优化的NAS策略,能够在在不降低性能指标的前提下,降低计算成本。本文配置了原论文中MNv4-Conv-S、MNv4-Conv-M、MNv4-Conv-L、MNv4-Hybrid-M和MNv4-Hybrid-L五种模型,以满足不同的需求。 模型 参数量 计算量 推理速度 YOLOv11m 20.0M 67.6GFLOPs 3.5ms

Limiiiing的博客 4455

前端使用print.js实现打印

前端使用print.js实现打印

weixin_41897680的博客 2万+

ET2012新版免狗免安装绿色软件

ET2012新版免狗免安祖昂绿色软件。,新界面,新视觉,

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

vue项目使用Print.js插件实现PDF文件打印

vue项目使用Print.js插件实现PDF文件打印

tigerhhzz的博客 1万+

温度PID控制PLC程序

温度PID稳定控制程序,适用于欧姆龙PLC,对其他PLC也具有很大参考价值

Print.js 开源项目教程

Print.js 开源项目教程 项目介绍 Print.js 是一个轻量级的 JavaScript 库,旨在简化网页内容的打印功能。它提供了易于使用的 API,允许开发者通过几行代码就能实现网页内容的打印。Print.js 支持多种打印选项,包括文本、图像、HTML 和 JSON 数据,使得它在各种前端项目中都非常实用。 项目快速启动 安装 你可以通过 npm 或直接在 HTML 中引入 Print...

gitblog_00976的博客 902

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

print.js 打印

例如:['border', 'padding'],将包括'border-bottom', 'border-top', 'border-left', 'border-right', 'padding-top'等。打印pdf时,如果浏览器不兼容(请检查浏览器兼容性表),库将在新选项卡中打开pdf。打印pdf时,如果浏览器不兼容(请检查浏览器兼容性表),库将在新选项卡中打开pdf。设置为false时,库不会处理应用于正在打印的html的样式。打印html、图像或json时,这将显示为文档标题。

qq_59574258的博客 4281

vue 项目中使用print.js实现表单的打印。

首先:在main.js中 import Print from '@/utils/print' // 引入js文件 Vue.use(Print); 在页面中: <div style="display: none"> //dispaly 用于显示或隐藏你需要打印的部分。 <div ref="print" > //命名ref...

qq_34312235的博客 3689

Vue实现多页打印( print.js)

Vue实现多页打印( print.js)

sunshineTing2的博客 6035

使用jQuery.print.js打印

需要的类:jquery,jquery.print.js html> head> print test head> body> input id="print_text_input" type="text"> input type="button" value="打印" onclick="print()"> sc

chaolyu的博客 1万+
上一篇: Ajax delete cache
下一篇: Java中的浅复制与深复制
chenaaron
博客等级 码龄23年 4粉丝 21原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值