window.print()打印功能

最新推荐文章于 2024-06-10 16:43:59 发布
最新推荐文章于 2024-06-10 16:43:59 发布
阅读量183 收藏
点赞数 1
分类专栏： JavaScript 文章标签： CSS Microsoft HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/happy100583/article/details/83525995
版权

按钮调用Print()方法直接打印body中的内容。

 


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){
      }
  }

//打印个人考核成绩
function Print() {
 if(confirm("确定要打印?")) {
 pagesetup_null();
 var headstr = "<html><head><title></title></head><body>";
 var footstr = "</body>";

 var oldstr = document.body.innerHTML;
 var noPrint = document.getElementById("noprint");
 noPrint.style.display='none';
 $(".main_table").css("width","640px");  //设置表格的宽度
 var newstr = document.body.innerHTML;
 document.body.innerHTML = headstr+newstr+footstr;  
 window.print();
 document.body.innerHTML = oldstr;
 pagesetup_default();
 }
}

happy100583
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
聊一聊浏览器打印 - window.print
郊眠寺
11-09 1万+
一般信息填写类的需求页面，都会增设「预览」和「打印」功能。我们会通过编写 DOM 及样式来绘制出预览视图，而打印则是基于预览来生成 PDF 文件。浏览器原生 API可以用于打印当前窗口（window.document）视图内容。调用此方法会产生一个打印预览弹框，用户可以根据具体设置来得到打印结果。接下来将从 code 层面带领大家熟悉「打印」的使用。为大家准备了一个前端资料包。包含54本，2.57G的前端相关电子书，《前端面试宝典（附答案和解析）》，难点、重点知识视频教程（全套）。
window.print打印指定div实例代码
09-04
`window.print()` 是JavaScript中的一个方法，它用于打开浏览器的打印对话框，从而让用户选择打印当前网页。但是，这个方法默认会打印整个页面，包括用户可能不希望打印的导航、侧边栏或者其他元素。在这种情况下，...
【前端】使用window.print() 前端实现网页打印详细教程（含代码示例）
最新发布
06-10 1万+
【前端】使用window.print() 前端实现网页打印详细教程（含代码示例）
使用window.print()打印表格，使每一个表格占用一张A4纸
lixu102593的博客
05-21 166
在每一个包裹表格循环的div上加一个css属性 page-break-after: always;，并且每一个的高度要自然撑起，不要给固定高度，如果表格太长就拆分成两个，自己调一下每个表格需要多高；最后循环的那个div的属性需要给 page-break-after: avoid;不然的话会多一张空白纸。
window.print() 前端页面打印与预览PDF
小先生编程
08-31 1万+
window.print()打印是浏览器自带的打印，实现原理是将html转换为pdf可以在线预览打印或者导出pdf，在任何网页上可通过Ctil+p快捷键调出浏览器打印程序，它可将整个网页打印出来，在我们开发中，其实并不需要将所有页面打印出来，或者只需要局部的页面做打印，那我我们就自己实现window.print（）打印功能。 浏览器自带的打印窗口（页眉页脚属于自带的，我们无法去掉，但是可以通过css将边距调小，将其覆盖掉） 打印常见的功能与问题处理 打印的功能以及布局全由css控制，在加上一些程序处理的业
一文弄懂window.print（）打印
学习 记录 总结 分享
04-04 9695
一般信息填写类的需求页面，都会增设「预览」和「打印」功能。我们会通过编写 DOM 及样式来绘制出预览视图，而打印则是基于预览来生成 PDF 文件。浏览器原生 API window.print() 可以用于打印当前窗口（window.document）视图内容。调用此方法会产生一个打印预览弹框，用户可以根据具体设置来得到打印结果。
window.print() 前端实现网页打印详解
大雾起了清晨
03-07 1万+
print作为浏览已经比较成熟的技术可以经常被用来打印页面的部分内容，我们可以在MDN上查看到相关的简单介绍。
web打印 window.print()介绍
09-05
- 不同浏览器可能对 `window.print()` 的支持程度不同，确保在多种浏览器中测试打印功能。 - 考虑到用户体验，打印前最好提供预览功能，让用户确认打印内容。 - 使用CSS媒体查询时，确保在打印样式表中设置适当的...
html和js通过window.print()实现调用浏览器打印带背景图片和生成二维码的文件功能
10-23
在网页开发中，有时我们...通过这个项目，你可以更直观地了解如何结合`window.print()`、背景图片和二维码生成来实现打印功能。在实际应用中，可能还需要根据具体需求进行调整，比如适应不同屏幕尺寸、优化打印布局等。
window.print打印指定div指定网页指定区域的方法
09-04
`window.print()` 是JavaScript中的一个内置函数，用于打开浏览器的打印对话框，让用户选择打印当前网页。但是，它默认会打印整个网页的所有内容。在本文中，我们将探讨如何利用 `window.print()` 结合其他技术来...
js window.print实现打印特定控件或内容
10-26
在JavaScript中，`window.print()`方法是一个非常实用的功能，它允许用户打印当前浏览器窗口中的整个网页。然而，有时我们可能只需要打印网页中的特定部分，比如一个特定的控件或者一个div元素。在这种情况下，我们...
js打印excel文档，打印table
01-08
js打印html页面中的指定内容案例，使用jq插件，printArea
webprint web直接打印不彈出對話框
03-17
webprint使用简单,灵活.能满足绝大多数页面打印的需要.它内含一个在vc7.0上开发的ATL小控件（只有74k）,这个小控件主要实现对IE浏览器中文档打印格式的控制，可以定制打印纸型，纸张来源，打印方向，设置表头，表尾，表格，表格列宽，打印预览，分页，缩放等等用户经常关心的属性。 webprint使用户通过脚本可以控制自定义纸张，打印方向，页边距等等属性达到定制打印的目的，这些定制属性的设置不会改变IE浏览器的默认打印机属性。也可以通过服务器端的页面调用WebPrint生成客户端的页面达到设置打印参数的目的。
window.print 打印的时候显示页码不显示标题和url链接
yiweiIt的博客
11-27 2598
3.页脚的内容要保存 但是页脚内容左侧会展示当前浏览器的地址链接这时候就要配合JS了，以下代码核心就是不要展示地址 于是新开了个页面将浏览器地址栏赋值为空或者‘·’这样打印的时候就不会出现地址栏地址了，但是于此同事页面的样式没有带过去 所以将原页面的style里的内容和引用的link内容页一并带过去 这样就能保证和原有样式是一样的了。最近做了个需求需要做的是在使用浏览器打印的时候要加上页码 比如当前第几页、打印的总页数。/* 在底部居中显示页码 */自然的显示又不影响页面展示的效果 费了我九牛二虎之力。
window.print打印pdf
Hitvz的博客
05-15 5016
1、前言   前端打印pdf就是使用原生的window.print()方法实现，这里有几个问题你会遇到。 打印纸张大小，不同纸张大小，你需要相应调整表格宽度和最大分页高度 分页时机，不适当的话会导致表格跨页分断 背景色打印，这个是不能设置的，但是通过css属性可以实现 打印时的css设置 前端环境：vue+element ui 2、代码实例 <template> <div> <div id="toolBox"> <
window.print 页面打印
别在熬夜了！
03-23 1315
打印测完 #oDiv2 div{width: 100px;height: 100px;border:1px solid #c50000;} aaa bbb ccc
实现excel在线打印
小白的豪豪
11-18 1493
这个功能和上一篇实现pdf内容中前面都差不多，让我们直接上代码 body内按钮： <div id='exclepdf' class="buttoncss" onclick="printout()"> <img src="...."><span>在线打印</span> </div> css样式设计： .buttoncss{ height:35px; width:100px; text-align:center; ...
window.print实现打印预览和打印功能问题记录
Komorebi_00的博客
09-21 873
前端实现打印预览和打印功能页面不刷新问题解决
window.print()实现局部打印及遇到的问题
weixin_45546982的博客
07-03 2072
window.print()实现局部打印
window.print()局部打印
04-01
在使用 JavaScript 进行打印操作时，可以使用 `window.print()` 方法来触发浏览器的打印功能。而如果想要局部打印某个 HTML 元素，可以通过以下步骤实现： 1. 获取需要打印的元素，可以通过 `document.querySelector()` 或 `document.getElementById()` 等方法来获取。 2. 创建一个新的空白窗口，可以使用 `window.open()` 方法来创建。 3. 在新窗口中插入需要打印的元素。 4. 调用新窗口的 `window.print()` 方法来触发打印功能。 以下是一个简单的示例代码： ```html <!-- 点击按钮触发打印功能 --> <button onclick="printContent()">Print Content</button> <!-- 要打印的元素 --> <div id="printableContent"> <h1>Printable Content</h1> <p>This is the content that will be printed.</p> </div> <script> function printContent() { // 获取要打印的元素 var content = document.getElementById("printableContent"); // 创建新窗口 var printWindow = window.open("", "PrintWindow"); // 在新窗口中插入要打印的元素 printWindow.document.write(content.outerHTML); // 调用新窗口的打印功能 printWindow.print(); } </script> ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值